Home >>jQuery Tutorial >jQuery addClass() Method

jQuery addClass() Method

jQuery addClass() Method

jQuery addClass() method in jQuery is used to adds one or more class names to the selected elements and note that this method only adds one or more class names to the class attribute but does not remove existing class attribute.

Syntax:
$(selector).addClass(classname,function(index,currentclass))

Parameter Values

Parameter Description
classname It is a required parameter and is used to add one or more class names
function(index,currentclass) It is Optional parameter and is used to returns one or more class names to be added to function
  • index – used to returns the set of the index position in the element
  • currentclass – used to returns the current class name of the selected element
Here is an Example of jQuery addClass() Method:

<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
$(".btn1").click(function(){
$(".txt1").addClass("txt2");
});
});
</script>
<style>
.txt2 {
font-size: 150%;
color: green;
}
</style>
</head>
<body>
<h1>Phptpoint</h1>
<p class="txt1">Learn here</p>
<button class="btn1">click me to add </button>
</body>
</html>

Output:

Phptpoint

Learn here