jQuery find sibling element with id class; Through this tutorial, i am going to show you how to find get,find and select sibling element from selected HTML element using the jQuery siblings () method.
jQuery Find Sibling Element by Id, Class
- jQuery siblings() Method
- Syntax jQuery siblings() Method
- Parameters of jQuery siblings() Method
- Example of jQuery get sibling element by id and add class
jQuery siblings() Method
siblings () method is used to return/get the sibling elements of the selected HTML element.
Syntax jQuery siblings() Method
$("selector").siblings(filter)
This returns the all the sibling elements.
Parameters of jQuery siblings() Method
- Filter :- The filter is an optional parameter that passes the method to reduce the traversal.
Example of jQuery get sibling element by id and add class
This example will demostrate you how use siblings method to selected html elements.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>siblings() Method Example</title>
<style type="text/css">
.g_cls{
background: green;
}
</style>
<script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("#p_sib").siblings().addClass("g_cls");
});
</script>
</head>
<body>
<div class="container">
<h3>Hello World</h3>
<p id="p_sib">This is paragraph</p>
<ul>
<li>First</li>
<li>Second</li>
<li>Third</li>
</ul>
</div>
</body>
</html>
Demo for jQuery get sibling element by id and add class
Hello World
This is paragraph
- First
- Second
- Third
Recommended jQuery Tutorials
Recommended:-jQuery Get and Set Input box By Name, Id
Recommended:-Get and Set CSS Property in jQuery
Recommended:-jQuery Insert Content Before or After an Element
Recommended:-jQuery HTML Append Prepend Example
Recommended:-jQuery Remove Text & Element From HTML
Recommended:-jQuery Add Remove Class on onClick
Recommended:-jQuery Set Checkbox Checked
Recommended:-jQuery Get Checkbox Checked Value
Recommended:-Get and Set Data Attribute Value in jQuery
Recommended:-jQuery Get Multiple Checkbox Value
Recommended:-jQuery Remove Attribute Disabled
Recommended:-jQuery Select Multiple HTML Elements
Recommended:-jQuery Get Data Id, Text Attribute Value
Recommended:-jQuery Set and Get width and height Of Element
Recommended:-jQuery Clone/Duplicate Html Elements
Recommended:-jQuery Wrap and Unwrap Multiple Html Element
Recommended:-jQuery Ajax Get Method with Example
Be First to Comment