THE WORLD'S LARGEST WEB DEVELOPER SITE

jQuery nextAll() Method

❮ jQuery Traversing Methods

Example

Return all next sibling elements of each <li> element with class name "start":

$(document).ready(function(){
  $("li.start").nextAll().css({"color": "red", "border": "2px solid red"});
});

Result:

    ul (parent)
  • li (sibling)
  • li (sibling)
  • li (sibling with class name "start")
  • li (sibling)
  • li (sibling)
  • li (sibling)
Try it Yourself »

Definition and Usage

The nextAll() method returns all next sibling elements of the selected element.

Sibling elements are elements that share the same parent.

The DOM tree: This method traverse forward along siblings of DOM elements.

Related methods:

  • next() - returns the next sibling element of the selected element
  • nextUntil() - returns all next sibling elements between two given arguments


Syntax

$(selector).nextAll(filter)

Parameter Description
filter Optional. Specifies a selector expression to narrow down the search for next siblings

Note: To return multiple siblings, separate each expression with a comma.

Try it Yourself - Examples

Narrow down the search
How to filter the search for next sibling elements.

Return multiple siblings
Using the filter parameter to get all siblings of a <h2> element that have class names "first", "second" and "third".

Select all next sibling elements of a <p> element
How to select all next sibling elements of a <p> element.

Select all next sibling <p> elements of <div>
How to select all next sibling <p> elements of each <div> element.


❮ jQuery Traversing Methods