Javatpoint Logo
Javatpoint Logo

jQuery nextUntil() method

The nextUntil() method is an inbuilt jQuery method. It is used to find the next sibling elements between selector and stop. This method traverses forwards along with the siblings of DOM elements.

If the selector is not supplied or not matched, the nextUntil() method will return all next sibling elements as similar to the nextAll() method.

Syntax

The selector in the above syntax is the starting element. It can be a tag name, class name or an id. The nextUntil() method accepts two optional parameters that are defined as follows -

stop: This is an optional parameter. It can be a selector expression, a jQuery object or an element that indicate where to stop the search.

filter: This is an optional parameter. It is a selector expression to narrow down the search.

Let's understand the nextUntil() method using some illustrations.

Example1

Here, there is a div element, including multiple children. We are using the nextUntil() method to get the siblings of the h1 element, as we are passing h1 as the selector.

We are passing the h3 element as the value of the stop parameter of the nextUntil() method. So, the method will return the siblings before the h3 heading element.

Test it Now

Output

After the execution of the above code, the output will be -

jQuery nextUntil() method

In the above screenshot, we can notice the siblings of the h1 element. On clicking the given button, the method will return the siblings before the h3 heading element. After clicking the given button, the output will be -

jQuery nextUntil() method

Example2

In this example we are using the both optional parameters of the nextUntil() method to filter the search between two elements. We are passing the h1 as the selector, h3 as the stop parameter, and span as the value of the filter parameter. We narrow down the search results by only returning the span elements as the next sibling between the heading h1, and heading h3.

Although, the div also has a span element after the h3 element but the method will only select the span elements occurring before h3.

Test it Now

Output

After the execution of the above code, the output will be -

jQuery nextUntil() method

On clicking the given button, the span elements before h3 will get selected. After clicking the given button, the output will be -

jQuery nextUntil() method

Example3

This example is similar to the above example. Here, there are multiple span elements between selector and stop. The nextUntil() method will return the span element with id = "s2" as we are narrow down the search by passing the id = "s2" as the filter.

Test it Now

Output

After the execution of the above code, the output will be -

jQuery nextUntil() method

On clicking the given button, the output will be -

jQuery nextUntil() method




Youtube For Videos Join Our Youtube Channel: Join Now

Help Others, Please Share

facebook twitter pinterest

Learn Latest Tutorials


Preparation


Trending Technologies


B.Tech / MCA