Описание: Получает всех последующих братьев каждого элемента до, но не включая элемент, соответствующий переданному селектору, узлу DOM или объекту jQuery.
.nextUntil( [селектор,] [фильтр] )
.nextUntil( [элемент,] [фильтр] )
Учитывая объект jQuery, который представляет набор элементов DOM, метод .nextUntil() позволяет нам искать в преемниках этих элементов в дереве DOM, останавливаясь при достижении элемента, указанного в методе аргумента.
Новый объект jQuery, который возвращается содержание всех следующих братьев до, но не включая один, указанный в селекторе .nextUntil().
Если селектор не соответствует или не предоставлен, все следующие братья будут выбраны; в этих случаях он выбирает те же элементы как метод
.nextAll(), когда не предоставляется ни один фильтр.
Начиная с jQuery 1.6, узел DOM или объект jQuery, вместо селектора, могут быть переданы в метод .nextUntil().
Метод опционально принимает выражение выбора как свой второй аргумент. Если этот аргумент указан, то элементы будут отфильтрованы по тестированию на соответствие ему.
Рассмотрим страницу с простым списком определений:
<dl> <dt>term 1</dt> <dd>definition 1-a</dd> <dd>definition 1-b</dd> <dd>definition 1-c</dd> <dd>definition 1-d</dd> <dt id="term-2">term 2</dt> <dd>definition 2-a</dd> <dd>definition 2-b</dd> <dd>definition 2-c</dd> <dt>term 3</dt> <dd>definition 3-a</dd> <dd>definition 3-b</dd> </dl>
Если мы начнем со второго термина, мы можем найти элементы, следующие за ним, до следующего тега <dt>.
$('#term-2').nextUntil('dt').css('background-color', 'red');
Результатом этого вызова будет красный фон определений 2-a, 2-b, и 2-c.
Пример
Находит братьев, которые следуют за<dt id="term-2"> до следующего <dt> и дает им красный фон.
Пример - Полный код:
<!DOCTYPE html> <html> <head> <script src="http://code.jquery.com/jquery-latest.js"></script> <script type="text/javascript" language="javascript"> $(document).ready(function(){ $("#term-2").nextUntil("dt").css("background-color", "red"); }); </script> </head> <body> <dl> <dt>term 1</dt> <dd>definition 1-a</dd> <dd>definition 1-b</dd> <dd>definition 1-c</dd> <dd>definition 1-d</dd> <dt id="term-2">term 2</dt> <dd>definition 2-a</dd> <dd>definition 2-b</dd> <dd>definition 2-c</dd> <dt>term 3</dt> <dd>definition 3-a</dd> <dd>definition 3-b</dd> </dl> </body> </html>

