CODEWITHSUNDEEP
javascriptjquery
Thorsten
Thorsten

Reputation: 233

Modify class list for multiple elements

How can I modify the class list via jQuery or JavaScript for multiple classes in one step?

I have several classes in my form like

<div class="form-group has-error has-feedback">...</div>
<div class="form-group has-error has-feedback">...</div>
<div class="form-group has-error has-feedback">...</div>

How can I remove all the classes except form-group?

<div class="form-group">...</div>
<div class="form-group">...</div>
<div class="form-group">...</div>

Upvotes: 2

Views: 751

Answers (2)

void
void

Reputation: 36703

You can use the .removeClass() method.

$(".form-group.has-error.has-feedback").removeClass("has-error has-feedback");

From the jQuery Documentation:

Description:

Remove a single class, multiple classes, or all classes from each element in the set of matched elements.

...

If a class name is included as a parameter, then only that class will be removed from the set of matched elements. If no class names are specified in the parameter, all classes will be removed.

Upvotes: 4

Zakaria Acharki
Zakaria Acharki

Reputation: 67505

JQuery

You can do it using attr function :

$('div.form-group.has-error.has-feedback').attr('class', 'form-group');

JAVASCRIPT

For javascript you can use querySelector and setAttribute() function :

document.querySelector('div.form-group.has-error.has-feedback').setAttribute('class', 'form-group');

Hope this helps.

Upvotes: 2

Related Questions