Método addClass
O método addClass adiciona
uma classe CSS especificada a um elemento.
Sintaxe
Uma classe CSS:
$(seletor).addClass(nome da classe CSS);
Várias classes CSS (como string):
$(seletor).addClass('classe1 classe2 classe3 ...');
Várias classes CSS (como array):
$(seletor).addClass(['classe1', 'classe2', 'classe3', '...']);
Aplicando uma função a cada elemento do conjunto:
$(seletor).addClass(function(índice no conjunto, classes CSS atuais do elemento));
Exemplo
Nosso parágrafo não tem nenhuma classe. Vamos
adicionar a classe www a ele:
<p id="test">texto</p>
$('#test').addClass('www');
O código HTML ficará assim:
<p id="test" class="www">texto</p>
Exemplo
Nosso parágrafo já tem uma classe. Vamos adicionar
a classe www a ele também:
<p id="test" class="eee">texto</p>
$('#test').addClass('www');
O código HTML ficará assim:
<p id="test" class="eee www">texto</p>
Exemplo
Nosso parágrafo já tem duas classes. Vamos
adicionar a classe www a ele também:
<p id="test" class="eee ggg">texto</p>
$('#test').addClass('www');
O código HTML ficará assim:
<p id="test" class="eee ggg www">texto</p>
Exemplo
Nosso parágrafo já tem uma classe. Vamos adicionar
mais duas classes a ele - www e ggg:
<p id="test" class="eee">texto</p>
$('#test').addClass('www ggg');
O código HTML ficará assim:
<p id="test" class="eee www ggg">texto</p>
Veja também
-
métodos
removeClass,toggleClass,hasClass -
Propriedade JavaScript
classlist,
que pode ser usada para adicionar e remover classes CSS de um elemento em JavaScript puro