jQuery .class Selector
The jQuery .class selector specifies the class for an element to be selected. It should not begin with a number. It gives styling to several HTML elements.
Syntax:
$(".class")
Parameter:
- class: This parameter is required to specify the class of the elements to be selected.
Example 1: In this example, we will select a class by using jQuery .class Selector.
HTML
<!DOCTYPE html><html><head> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"> </script> <script> $(document).ready(function () { $(".Beginner").css("background-color", "pink"); }); </script></head><body> <p class="Beginner">Beginner For Beginner</p> <span class="Beginner"> jQuery|.class selector </span></body></html> |
Output:
Example 2: In this example, we will change the background color of the class that we have selected.
HTML
<!DOCTYPE html><html><head> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"> </script> <script> $(document).ready(function () { $(".Beginner").css("background-color", "orange"); }); </script></head><body> <div style="border:2px solid red" class="Beginner"> Beginner For Beginner </div> <br><br> <span class="Beginner"> jQuery|.class selector </span></body></html> |
Output: