styling element using jquery
- Published
- Reading time
- 1 min read
- Length
- 179 words
On this page
Styling Elements Using jQuery#
jQuery is a popular JavaScript library that enables developers to manipulate HTML elements on web pages. It provides a wide range of methods that can be used to style and animate elements, including:
css()addClass()removeClass()toggleClass()
The css() Method#
The css() method allows you to set or get the value of a CSS property for an element. You can pass in the property name and value as arguments, or an object containing multiple property-value pairs:
$("div").css("background-color", "red");
$("p").css({
"font-size": "16px",
"color": "blue"
});The addClass() Method#
The addClass() method adds one or more CSS classes to the selected elements:
$("div").addClass("highlight");The removeClass() Method#
The removeClass() method removes one or more CSS classes from the selected elements:
$("div").removeClass("highlight");The toggleClass() Method#
The toggleClass() method toggles one or more CSS classes on the selected elements:
$("div").toggleClass("highlight");These are just a few examples of how jQuery can be used to style HTML elements. With a little experimentation, you can achieve all sorts of cool effects on your web pages.