Як синф барои услуб додан дар JavaScript

Фарз мекунем, ки мо ду синф дорем, ки ба унсури мувофиқи ҳолаташ медиҳем:

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

Дар асл, мавҷудияти ду синф дар ин ҷо метавонад мушкилот барорад. Дар ин ҳолат мо метавонем услубҳоро ба тариқи зерин нависед тавассути селектори :not:

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

Дар ин ҳолат мо метавонем ба тариқи мувофиқ синфи худро toggle кунем, унсурро фаъол ё ғайрифаъол сохтан:

elem.classList.toggle('active');

Абзасҳо дода шудаанд. Чунон кунед, ки ҳар як абзас дар клики аввал ба он ранги сурх гирад, ва дар клики дуввум - боз ба сиёҳ ранг гирад.