Question

I have the following jQuery code which all works fine:

         $("#sidebar .m3, #sidebar .m5").toggle(function() {                  
               $(this).find("img").attr({­src:"images/Up.png"});                 
               }, function() {
               $(this).find("img").attr({­src:"images/Down.png"});                  
         }); 

My question is, instead of individually specifying $(“#sidebar .m3, #sidebar .m5”), where my menu items may have the classes m1,m2,m3,m4,m5 etc,
is there anyway of having something like:

$("#sidebar .m[*]").

That will cater for any number after the “.m” , so I don’t need to hard code m3 or m5?

Thanks.

Answer 1

If that’s the only (or first) class applied to the menu item you can use the attribute starts with selector.

$('#sidebar [class^=m]')...

A better way would be to give them all a common class, like menu-item, in addition to your other class that functions simply as a selector to group them all, then simply use:

$('#sidebar .menu-item')...