Open In App

What is the use of css() method in jQuery ?

Improve
Improve
Like Article
Like
Save
Share
Report

In this article, we will see how to use css() method to set the styles on elements dynamically using jQuery. The css() method is used to change the style property of the selected element. basically, The CSS() method is used to get the value of a certain CSS property that has been applied to a specific HTML element. Additionally, it is used to set the CSS property with its value for the specific HTML element.

Syntax:

$(selector).css(property)

Approach: Here, we have added a paragraph element and a button and after clicking on the button, the css() method is called and this method applies the CSS styles on the paragraph element.

Example: In this example, we are using the above-explained approach.

HTML




<!DOCTYPE html>
<html>
<head>
    <title>
        What is the use of css() method in JQuery?
    </title>
 
    <script src=
    </script>
 
    <style>
        body {
            text-align: center;
        }
         
        button {
            background-color: green;
            color: white;
            font-size: 24px;
            border-radius: 5px;
            padding: 15px 32px;
            text-align: center;
            text-decoration: none;
        }
    </style>
 
    <script>
        $(document).ready(function() {
            $("button").click(function() {
                $("#GFG").css({
                    color: "white",
                    background: "green",
                    fontSize: "25px",
                    display: "table",
                    margin: "0px auto 0px auto"
                });
            });
        });
    </script>
</head>
 
<body>
    <h1 style="color:green">
        GeeksforGeeks
    </h1>
 
    <h2>
        What is the use of css() method in JQuery?
    </h2>
 
    <p id="GFG">
        Welcome to GeeksforGeeks!
    </p>
 
    <br>
 
    <button>
        Click Here
    </button>
</body>
</html>


Output:



Last Updated : 02 Jun, 2023
Like Article
Save Article
Previous
Next
Share your thoughts in the comments
Similar Reads