Uma classe para estilização em JavaScript

Suponha que temos duas classes que atribuímos a um elemento dependendo do seu estado:

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

Na verdade, a presença de duas classes aqui pode atrapalhar. Nesse caso, podemos reescrever os estilos da seguinte forma usando o seletor :not:

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

Dessa forma, podemos alternar convenientemente nossa classe, tornando o elemento ativo ou inativo:

javascriptelem.classList.toggle('active');