css method to modify element styles. It’s a best practice to group all of the style code in a CSS file, and use jQuery to add and remove the classes from elements — this approach aligns to a design principle called separation of concerns.
To keep CSS properties in a CSS file, jQuery can add a CSS class to an element with a method named
addClass. It’s syntax looks like this:
In the example above:
.addClass()is called on the jquery
'active'class to all
- Notice that the argument passed to
addClassdoes not have a period preceding it. This is because it expects a class, and therefore only needs the name of the class.
Instead of changing the text color and background color with the
.css() method, replace the code in the menu button mouse enter handler with the
If you navigate to css/styles.css, there’s a class named
.button-active, which defines the text color and background color of an element. Use the
.addClass() method to add
button-active to the
.menu-button element when it’s moused over.