How to add CSS properties to an element dynamically using jQuery ?
Last Updated :
11 May, 2023
In this article, we will see how to add some CSS properties dynamically using jQuery. To add CSS properties dynamically, we use css() method. The css() method is used to change the style property of the selected element.
The css() method can be used in different ways. This method can also be used to check the present value of the property for the selected element:
Syntax:
$(selector).css(property)
Here we have created two elements inside the body tag i.e. <h1> and <h3> elements. We apply CSS property on the <body> tag and <h1> tag using CSS () method dynamically.
Example: In this example, we will add CSS properties to an element using jQuery.
HTML
<!DOCTYpe html>
<html>
<head>
<title>
How to add CSS properties to an
element dynamically using jQuery?
</title>
<script src=
</script>
<script>
$(document).ready(function () {
$("body").css("text-align", "center");
$("h1").css("color", "green");
});
</script>
</head>
<body>
<h1>GeeksforGeeks</h1>
<h3>
How to add CSS properties to an element
<br>dynamically using jQuery?
</h3>
</body>
</html>
|
Output:
Like Article
Suggest improvement
Share your thoughts in the comments
Please Login to comment...