# Single class for styling in JavaScript

Suppose we have two classes that we give to an element depending on its state:

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

In fact, the presence of two classes here may be redundant. In this case, we can rewrite the styles as follows via the `:not` selector:

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

In this case, we can conveniently toggle our class, making the element active or inactive:

`elem.classList.toggle('active');`

Given paragraphs. Make each paragraph turn red on the first click on it, and turn black back on the second click.

← →
↑
en ru