Selecting multiple classes with jQuery

Question

I’ve had a good look and can’t seem to find out how to select all elements matching certain classes in one jQuery selector statement such as this:

$('.myClass', '.myOtherClass').removeClass('theclass');

Any ideas on how to achieve this? The only other option is to do

$('.myClass').removeClass('theclass');
$('.myOtherClass').removeClass('theclass');

But I’m doing this with quite a few classes, so it requires much code.

score 409 · Accepted Answer · answered Jan 28 '09 at 16:29

409

This should work:

$('.myClass, .myOtherClass').removeClass('theclass');

You must add the multiple selectors all in the first argument to $(), otherwise you are giving jQuery a context in which to search, which is not what you want.

It's the same as you would do in CSS.

answered Jan 28 '09 at 16:29

Erik Bakker

4,579
1
17
8

3

What if I want to match it only when each of the element have all the specified classes? – IsmailS Sep 02 '11 at 13:01
12

Al right, I got this one http://stackoverflow.com/q/1041344/148271. basically I will have to join all the selector for intersection. Like `$(".myClass.myOtherClass")` – IsmailS Sep 02 '11 at 13:03
More on CSS grouping: [W3C "Grouping"](http://www.w3.org/TR/CSS2/selector.html#grouping). – skrounge Jun 07 '13 at 02:34
@wal: That comma is necessary also in CSS when pointing to both classes. Without the comma it'd reference to `.myOtherClass` that is somewhere inside `.myClass`. – geekuality Oct 06 '14 at 12:14
this answer doesn't answer the question, this way you're making an OR!!!! not AND!! – Mark Khateeb Nov 27 '15 at 16:34
Note: this will return all element that have either class. If you want only elements that have both classes then use $('.myClass.myOtherClass') – pat capozzi Feb 29 '16 at 18:01

score 26 · Answer 2 · answered Jan 28 '11 at 12:23

26

I use $('.myClass.myOtherClass').removeClass('theclass');

answered Jan 28 '11 at 12:23

Adman

335
5
6

34

This is if an HTML element has multiple classes, and you want to remove the class for the element only with _all_ of those classes. Other examples will remove the class from any element with any of the classes that are comma-separated. Your example would only work if my HTML element had _both_, such as `
`
– Kieran Senior Jan 30 '11 at 10:32

score 26 · Answer 3 · answered Jan 28 '09 at 16:29

26

Have you tried this?

$('.myClass, .myOtherClass').removeClass('theclass');

answered Jan 28 '09 at 16:29

Ionuț G. Stan

176,118
18
189
202

score 0 · Answer 4 · answered Jan 31 '19 at 08:42

// Due to this Code ): Syntax problem.    
$('.myClass', '.myOtherClass').removeClass('theclass');

According to jQuery documentation: https://api.jquery.com/multiple-selector/

When can select multiple classes in this way:

jQuery(“selector1, selector2, selectorN”) // double Commas. // IS valid.
jQuery('selector1, selector2, selectorN') // single Commas. // Is valid.

by enclosing all the selectors in a single '...' ' or double commas, "..."

So in your case the correct way to call multiple classes is:

$('.myClass', '.myOtherClass').removeClass('theclass'); // your Code // Invalid.
$('.myClass , .myOtherClass').removeClass('theclass');  // Correct Code // Is valid.

Selecting multiple classes with jQuery

4 Answers4

Linked

Related