FREE Web Template Download
HTML CSS JAVASCRIPT SQL PHP BOOTSTRAP JQUERY ANGULARJS TUTORIALS REFERENCES EXAMPLES Blog
 

jQuery nextAll() Method

jQuery HTML Methods 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.

Examples

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 HTML Methods jQuery Traversing Methods