Avantajele stilizării cu clase CSS în JavaScript

Utilizarea claselor în loc să modificăm stilurile direct are încă un avantaj. Cu o mișcare ușoară a mâinii putem face ca stilurile elementelor să alterneze.

De exemplu, putem face ca la primul click pe un paragraf acesta să se coloreze într-o anumită culoare, iar la un al doilea click - să își revină la culoarea inițială. Pentru aceasta trebuie doar să înlocuim metoda add cu metoda toggle:

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

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