Une classe unique pour le style en JavaScript

Supposons que nous ayons deux classes que nous attribuons à un élément en fonction de son état :

cssdiv.active {
  color: red;
}
div.passive {
  color: black;
}

En réalité, la présence de deux classes ici peut gêner. Dans ce cas, nous pouvons réécrire les styles de la manière suivante via le sélecteur :not :

cssdiv.active {
  color: red;
}
div:not(active) {
  color: black;
}

Dans ce cas, nous pourrons de manière pratique activer/désactiver notre classe, rendant l'élément actif ou inactif :

javascriptelem.classList.toggle('active');