jQuery .class Selector
Last Updated :
17 Nov, 2022
Improve
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.
<!DOCTYPE html>
<html>
<head>
<script src=
"https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js">
</script>
<script>
$(document).ready(function () {
$(".GEEKS").css("background-color", "pink");
});
</script>
</head>
<body>
<p class="GEEKS">Geeks For Geeks</p>
<span class="GEEKS">
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.
<!DOCTYPE html>
<html>
<head>
<script src=
"https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js">
</script>
<script>
$(document).ready(function () {
$(".GEEKS").css("background-color", "orange");
});
</script>
</head>
<body>
<div style="border:2px solid red" class="GEEKS">
Geeks For Geeks
</div>
<br><br>
<span class="GEEKS">
jQuery|.class selector
</span>
</body>
</html>
Output:
