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() {

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


Live demo