Método add do objeto classList

O método add do objeto classList permite adicionar classes CSS a um elemento.

Sintaxe

javascriptelemento.classList.add(classe);

Exemplo

Vamos adicionar a classe kkk ao elemento:

html<p id="elem" class="www ggg zzz"></p>

javascriptlet elem = document.querySelector('#elem');
elem.classList.add('kkk');

Resultado da execução do código:

html<p id="elem" class="www ggg zzz kkk"></p>

Exemplo

Vamos adicionar a classe zzz ao elemento, que já existe no elemento - nada acontecerá, pois classes duplicadas não são adicionadas:

html<p id="elem" class="www ggg zzz"></p>

javascriptlet elem = document.querySelector('#elem');
elem.classList.add('zzz');

Resultado da execução do código:

html<p id="elem" class="www ggg zzz"></p>

Veja também