jQuery: remove all classes from an element

jQuery: remove all classes from an element

removeClass(), without parameters, can be used to remove all the specified CSS classes from an element.

jQuery provides the removeClass() method to remove one or more CSS classes from an element. The interesting thing of this method is that if you call it without specifying a class name, it simply removes all the classes from an element.

Given the following markup:

<p id="test" class="one two three">Test</p>​

With the following CSS classes:

.one {
    background: #ffc;
    padding: 1em;
}

.two {
    border: 0.1em solid #f70;
}

.three {
    border-radius: 6px;
    box-shadow: 2px 2px 3px #ccc;
}​

We can use removeClass() as follows:

$(function() {
    $('#test').click(function() {
        
        $(this).removeClass();
        
    });
    
});​

All the CSS classes attached to the element will be removed. You can see the demo below.

Demo

Live demo