Comprobar el atributo class con jQuery jQuery

El atributo class en HTML es utilizado como un selector múltiple, a diferencia del atributo id que es un selector único. Comprobar el valor del atributo class de un determinado elemento es una necesidad bastante frecuente, entre otros casos, cuándo se está manipulando el DOM.

En el API de jQuery contamos con el método .hasClass(), un método que, como su nombre indica, comprueba si un elemento tiene una determinada clase. Por ejemplo, imaginemos que tenemos este HTML:

<div id="midiv" class="azul rojo"></div>

Comprobar si «midiv» tiene la clase «azul»:

if( $( "#midiv" ).hasClass( "azul" ) ) {
     alert("Tiene azul!!");
}

En el siguiente caso también daría positivo:

if( $( "#midiv" ).hasClass( "rojo" ) ) {
     alert("Tiene rojo!!");
}

Sin embargo, el método hasClass() tiene algunas limitaciones. Por ejemplo, si queremos comprobar si un elemento tiene dos o más clases a la vez tendríamos que ejecutar el método varias veces, una por cada clase a comprobar. Para estas y otras comprobaciones más complejas es mejor utilizar el método is(). Con el método is() también se puede comprobar pseudoclases, por ejemplo :hidden u :hover:

if( $( "#midiv" ).is( ".azul.rojo" ) ) {
     alert("Tiene azul y rojo!!");
}

if( $( "#midiv" ).is( ".azul:hover" ) ) {
     alert("Tiene azul y hover!!");
}