jQuery Selectors Complete Reference

jQuery selectors are used to select the HTML element(s) and allow you to manipulate the HTML element(s) in the way we want. It selects the HTML elements on a variable parameter such as their name, classes, id, types, attributes, attribute values, etc.

Syntax:

$("")

Example: In this example, we will select a class by using jQuery .class Selector.

HTML

<!DOCTYPE html>
<html> 

<head> 
    <!-- Ensure that jQuery is properly linked -->
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> 

    <script> 
        $(document).ready(function () { 
            // Set background color to green for elements with class 'GEEKS'
            $(".GEEKS").css("background-color", "green"); 
        }); 
    </script> 
</head> 

<body> 
    <!-- Paragraph with class 'GEEKS' -->
    <p class="GEEKS">GeeksforGeeks</p> 

    <!-- Span with class 'GEEKS' -->
    <span class="GEEKS">jQuery | .class selector</span> 
</body> 

</html>

Output:

All the jQuery selectors are listed below:

jQuery Selectors	Description
*	Selects all the elements in the document, including HTML, body, and head.
#id	Specifies an id for an element to be selected.
.class