Traversing Sideways in The DOM Tree
There are many useful jQuery methods for traversing sideways in the DOM tree:
siblings()
next()
nextAll()
nextUntil()
prev()
prevAll()
prevUntil()
The siblings()
method returns all sibling elements of the selected element.
The following example returns all sibling elements of <h2>
:
The following example returns all sibling elements of <h2>
that are <p>
elements:
$(document).ready(function(){
$("h2").siblings("p");
});
The next()
method returns the next sibling element of the selected element.
The following example returns the next sibling of <h2>
:
$(document).ready(function(){
$("h2").next();
});
The nextAll()
method returns all next sibling elements of the selected element.
The following example returns all next sibling elements of
<h2>
:
$(document).ready(function(){
$("h2").nextAll();
});
The nextUntil()
method returns all next sibling elements between two given
arguments.
The following example returns all sibling elements
between a <h2>
and a <h6>
element:
$(document).ready(function(){
$("h2").nextUntil("h6");
});