jQuery :root Selector (original) (raw)

Last Updated : 11 Jul, 2025

The jQuery :root selector is used to select the root element of the HTML document.

Syntax:

$(":root")

Parameter: This selector contains single parameter root which is the root element of document.

Example 1: This example use :root selector to select document and set background-color to green.

HTML `

GeeksForGeeks

jQuery :root Selector

<!-- Script uses :root selector -->
<script>
    $(document).ready(function () {
        $(":root").css("background-color", "green");
    });
</script>

`

Output:

Example 2: This example use :root selector to select document and change text color to red.

HTML `

GeeksForGeeks

jQuery :root Selector

<!-- Script uses :root selector -->
<script>
    $(document).ready(function () {
        $("button").click(function () {
            $(":root").css("color", "red");
        });
    });
</script>

`

Output: