Agregar una clase a un elemento en jQuery
Recuerdo que en el atributo
class
en el código HTML se pueden escribir varios
clases separadas por espacios.
Imaginemos una situación: usted quiere
agregar una nueva clase a las existentes, sin sobrescribir
ellas en el proceso. En este caso, simplemente tomar
y hacer .attr('class', 'new-class')
no funcionará (usando el método
attr)
- usted borrará aquellas clases que
ya están en el atributo.
Se podría, por supuesto, primero leer las clases,
que ya están allí, luego agregar la nuestra
clase separada por un espacio y escribir todo de vuelta
en el atributo, pero hay una manera más fácil - en jQuery
para tales cosas está previsto el método
addClass.
El método addClass permite agregar
una clase al elemento (o elementos), sin sobrescribir
en el proceso otras clases. La clase que
quiere agregar al elemento, se acepta como
parámetro de este método.
En el siguiente ejemplo tenemos un elemento con
dos clases - class="www zzz":
<p class="www zzz" id="test">text</p>
Podemos agregarle una tercera clase -
kkk. Como resultado, el contenido del atributo
se volverá así - class="www zzz kkk":
$('#test').addClass('kkk');
El código HTML se verá así:
<p class="www zzz kkk" id="test">text</p>
Agregue a todos los li la clase test.
