jQuery Tutorial Tutorials - jQuery .prevUntil() method

jQuery .prevUntil() method

The .prevUntil([selector][,filter]) method in jQuery is used to get all preceding siblings of each element up to
until meeting the element specified by selector,
but not including the element matched by the selector, DOM node, or jQuery object specified by filter.

jQuery .prevUntil() method Syntax

.prevUntil([selector][,filter])
.prevUntil([element[,filter])
Parameter Type Description
selector Selector selector expression to indicate where to stop matching preceding sibling elements
element Element, jQuery DOM element or jQuery object indicating where to stop matching preceding sibling elements
filter Selector selector expression to match elements against

jQuery .prevUntil() method Example

example

Find the sibling elements that before term 3,until meeting the <dt>.

HTML

<dl>
    <dt id="term-1">term 1</dt>
        <dd>definition 1-a</dd>
        <dd class="selected">definition 1-b</dd>
        <dd>definition 1-c</dd>
        <dd class="selected">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 id="term-3">term 3</dt>
        <dd>definition 3-a</dd>
        <dd>definition 3-b</dd>
</dl>

jQuery

$("#term-3").prevUntil('dt')

Result

  <dd>definition 2-a</dd>
  <dd>definition 2-b</dd>
  <dd>definition 2-c</dd>

Try now

example

Find the sibling elements that before term 2 and matched by the selector .selected,up to the <dt>.

HTML

<dl>
    <dt id="term-1">term 1</dt>
        <dd>definition 1-a</dd>
        <dd class="selected">definition 1-b</dd>
        <dd>definition 1-c</dd>
        <dd class="selected">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 id="term-3">term 3</dt>
        <dd>definition 3-a</dd>
        <dd>definition 3-b</dd>
</dl>

jQuery

$("#term-2").prevUntil('dt','.selected');

Result

<dd class="selected">definition 1-b</dd>
<dd class="selected">definition 1-d</dd>
Date：2019-08-26 14:14:00 From:www.Lautturi.com author：Lautturi
.prevAll() method
.siblings() method