Výhoda stylování pomocí CSS tříd v JavaScriptu

Používání tříd namísto přímé změny stylů má ještě jednu výhodu. Lehkým pohybem ruky můžete zařídit, že styly prvků se budou střídat.

Například můžete zařídit, že při prvním kliku na odstavec se obarví určitou barvou, a při opakovaném kliknutí - vrátí si původní barvu. K tomu stačí prostě metodu add změnit na metodu toggle:

javascriptlet elems = document.querySelectorAll('p');

for (let elem of elems) {
  elem.addEventListener('click', function() {
    this.classList.toggle('colored');
  });
}