Adding/Removing Classes

Using classList for better style management

Lesson 55

+25 XP

Step 1 of 5

Working with CSS Classes

The classList property provides methods to add, remove, and toggle CSS classes. This is better than using the style property for complex styling!

Why use classes? Classes let you define styles in CSS and apply them dynamically with JavaScript. This keeps your code organized and maintainable!

/* CSS: */
.highlight {
  background-color: yellow;
  font-weight: bold;
}

// JavaScript:
let element = document.querySelector("p");
element.classList.add("highlight");