jQuery siblings() Method
jQuery
Traversing MethodsExample
Return all sibling elements of each <li> element with class name "start":
$(document).ready(function(){
$("li.start").siblings().css({"color": "red", "border": "2px solid red"});
});
$("li.start").siblings().css({"color": "red", "border": "2px solid red"});
});
Result:
- ul (parent)
- li (sibling)
- li (sibling)
- li (sibling with class name "start")
- li (sibling)
- li (sibling)
Definition and Usage
The siblings() method returns all sibling elements of the selected element.
Sibling elements are elements that share the same parent.
The DOM tree: This method traverse forward and backwards along siblings of DOM elements.
Tip: Use the prev() or next() method to narrow down the search for only previous or next sibling elements.
Syntax
$(selector).siblings(filter)
| Parameter | Description |
|---|---|
| filter | Optional. Specifies a selector expression to narrow down the search for sibling elements |
Try it Yourself - Examples
Narrow down the search
How to
use both parameters to filter the search for sibling elements.
Select
all sibling <p> elements of each <div> element
How to narrow down the search for all sibling <p> elements of each <div> element.
