jQuery Find Sibling with id, Class

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

siblings() Method Example

Hello World

This is paragraph

First
Second
Third