jQuery element ~ siblings Selector
The element ~ siblings selector in jQuery is used to select all elements that are siblings of the specified element.
Syntax:
("element ~ siblings")Parameter: It contains two parameters as mentioned above and described below:
- element: It is required parameter and used for any valid jQuery selector.
- siblings: It is required parameter and used for specifying the siblings of the element parameter.
Example 1:
HTML
<!DOCTYPE html><html><head> <title> jQuery element ~ siblings Selector </title></head><body style="text-align:center;"> <h1 style="color:green;"> GeeksforGeeks </h1> <h2>jQuery element ~ siblings Selector</h2> <p>Geeks1</p> <div> <p>Geek2</p> <p>Geeks3</p> </div> <p>Geek4</p> <p>Geeks5</p> <div> <p>Geek6</p> </div> <script src= </script> <script> $(document).ready(function () { $("div ~ p").css("background-color", "green"); }); </script></body></html> |
Output:
Example 2:
HTML
<!DOCTYPE html><html><head> <title> jQuery element ~ siblings Selector </title></head><body style="text-align:center;"> <h1 style="color:green;"> GeeksforGeeks </h1> <h2>jQuery element ~ siblings Selector</h2> <p>Geeks1</p> <div> <p>Geek2</p> <p>Geeks3</p> </div> <p>Geek4</p> <p>Geeks5</p> <div> <p>Geek6</p> </div> <script src= </script> <script> $(document).ready(function () { $("p ~ div").css("border", "2px solid red"); }); </script></body></html> |
Output:
Please Login to comment...