Open In App
Related Articles

jQuery parent descendant Selector

Improve Article
Improve
Save Article
Save
Like Article
Like

jQuery parent descendant Selector selects every element which is a descendant to a specific(parent) element. 

Syntax: 

$("parent descendant")

Example 1:  In this example, we are using parent descendant selector.

html




<!DOCTYPE html>
<html>
 
<head>
    <script src=
    </script>
    <script>
        $(document).ready(function () {
            $("div span").css("color",
                "lightgreen");
        });
    </script>
</head>
 
<body>
    <h4>This div element has descendant span:</h4>
    <div>
        <span>DESCENDANT ELEMENT</span>
    </div>
</body>
 
</html>


Output: 

Example 2:  Here is another example, of parent descendant selector.

HTML




<!DOCTYPE html>
<html>
 
<head>
    <script src=
    </script>
    <script>
        $(document).ready(function () {
            $("button").click(function () {
                $("div span").css("color", "lightgreen");
            });
        });
    </script>
</head>
 
<body>
    <h4>This div element has descendant span:</h4>
    <div>
        <span>DESCENDANT ELEMENT</span>
    </div>
    <br>
    <button>Change color</button>
</body>
 
</html>


Output:


Whether you're preparing for your first job interview or aiming to upskill in this ever-evolving tech landscape, GeeksforGeeks Courses are your key to success. We provide top-quality content at affordable prices, all geared towards accelerating your growth in a time-bound manner. Join the millions we've already empowered, and we're here to do the same for you. Don't miss out - check it out now!

Last Updated : 06 Jul, 2023
Like Article
Save Article
Previous
Next
Similar Reads
Complete Tutorials