Introduction:

Here we are going to explain what is addClass() function or how to use addClass() function or why use addClass() function or how to add class to the selected elements  in jQuery with example.

Description: 

The jQuery addClass() method is used to add one or more class name to the selected html element. This method is used only to add one or more class names to the class attributes. It is not remove the existing class name to the class attributes.

If you want to add more than one class separate the class names with spaces.

Syntax:

$(selector).addClass(classname)

Let’s see, Example of jQuery addClass() method:

 <!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>Example of jQuery addClass method</title>
    <script type="text/javascript" src="https://code.jquery.com/jquery-1.10.2.js"></script>
    <style>
        .Content {
            background-color: yellow;
            font-size: 25px;
        }
    </style>
    <script type="text/javascript">
        $(document).ready(function () {
            $("button").click(function () {
                $("p").addClass("Content");
            });
        });
    </script>
 
</head>
<body>
    <p>SQL Tutorials Point</p>
    <button>Add Class</button>
</body>
</html>


 Let's check live example

comments


Leave a comment

Make sure you enter the (*) required information where indicated. HTML code is not allowed.

You may also like