3

How can I target more than element in a single jQuery selector?

I am trying do add a class to all my soundcloud and youtube widget when a page is loaded. I have no problem doing it for soundcloud, with this :

 $("iframe[src^='https://w.soundcloud.com/']").addClass("widget");

I would like to apply this class to a youtube iframe as well. How can I select both iframes? I tried with :

$("iframe[src^='https://w.soundcloud.com/' or src^='http://www.youtube.com']").addClass("widget");

That, as well as other of my attempts, do not work...

Thanks in advance for any help !

skrounge
  • 385
  • 2
  • 10
Christophe P
  • 63
  • 5
  • Similar to [jQuery - Selecting Multiple Classes](http://stackoverflow.com/questions/488305/jquery-selecting-multiple-classes). – skrounge Jun 07 '13 at 02:31

2 Answers2

1

CSS selectors use , for 'or' which is known as grouping in CSS.

$("iframe[src^='https://w.soundcloud.com/'], iframe[src^='http://www.youtube.com']").addClass("widget");

Source: W3C "Grouping"

skrounge
  • 385
  • 2
  • 10
  • @user2461866 Would you mind marking the post as accepted? [StackOverflow: About - look for "accepted"](http://stackoverflow.com/about). – skrounge Jun 07 '13 at 02:45
0

Selector syntax oesn't support or. The way of alternating two selectors is ,:

$("iframe[src^='https://w.soundcloud.com/'], iframe['src^='http://www.youtube.com']").addClass("widget");
kevingessner
  • 18,559
  • 5
  • 43
  • 63