classList Methods in JavaScript

From the DOM Manipulation cheat sheet · Styling & Classes · verified Jul 2026

classList Methods

Manage CSS classes on elements with the classList API

javascript
// Add class
element.classList.add('active')
element.classList.add('highlight', 'large')

// Remove class
element.classList.remove('active')
element.classList.remove('highlight', 'large')

// Toggle class
element.classList.toggle('visible')

// Check class
if (element.classList.contains('active')) {
  // Has active class
}

// Replace class
element.classList.replace('old-class', 'new-class')
💡 classList is more efficient than className manipulation
⚡ Can add/remove multiple classes at once
📌 toggle() returns true if class was added, false if removed
✅ classList.contains() is cleaner than string searching

More JavaScript tasks

Back to the full DOM Manipulation cheat sheet