eozzy
eozzy

Reputation: 68680

Removing multiple classes (jQuery)

Is there any better way to rewrite this:

$('element').removeClass('class1').removeClass('class2');

I cannot use removeClass(); as it would remove ALL classes, which I don't want.

Upvotes: 715

Views: 434983

Answers (8)

Scott Evernden
Scott Evernden

Reputation: 39926

$('element').removeClass('class1 class2');

Here are the docs.

Upvotes: 92

xgqfrms
xgqfrms

Reputation: 12176

There are many ways can do that!

jQuery

  1. remove all class
    $("element").removeClass();
    OR
    $("#item").removeAttr('class');
    OR
    $("#item").attr('class', '');
    OR
    $('#item')[0].className = '';

  2. remove multi class
    $("element").removeClass("class1 ... classn");
    OR
    $("element").removeClass("class1").removeClass("...").removeClass("classn");

Vanilla Javascript

  1. remove all class

// remove all items all class  
const items = document.querySelectorAll('item');
for (let i = 0; i < items.length; i++) {
    items[i].className = '';
}

  1. remove multi class

// only remove all class of first item
const item1 = document.querySelector('item');
item1.className = '';

Upvotes: 20

SeanJA
SeanJA

Reputation: 10354

jQuery .removeClass() documentation.

One or more CSS classes to remove from the elements, these are separated by spaces.

Upvotes: 22

Avishek Mondal
Avishek Mondal

Reputation: 21

You must be separate those classes which you want to remove by white space$('selector').removeClass('class1 class2');

Upvotes: 2

Mark Fisher
Mark Fisher

Reputation: 1257

Since jQuery 3.3.0, it is possible to pass arrays to .addClass(), .removeClass() and toggleClass(), which makes it easier if there is any logic which determines which classes should be added or removed, as you don't need to mess around with the space-delimited strings.

$("div").removeClass(["class1", "class2"]); 

Upvotes: 4

codemirror
codemirror

Reputation: 3572

Separate classes by white space

$('element').removeClass('class1 class2');

Upvotes: 4

deceze
deceze

Reputation: 522081

The documentation says:

class (Optional) String
One or more CSS classes to remove from the elements, these are separated by spaces.

Example:

Remove the class 'blue' and 'under' from the matched elements.

$("p:odd").removeClass("blue under");

Upvotes: 21

cletus
cletus

Reputation: 625077

$("element").removeClass("class1 class2");

From removeClass(), the class parameter:

One or more CSS classes to remove from the elements, these are separated by spaces.

Upvotes: 1288

Related Questions