This is how to bind multiple events on a couple jQuery selectors:

$('#selector1,.selector2').bind('event', function (e, ui) {
   // Stuff
});

But! How do you bind on predeclared jQuery objects. Example:

var jSelector1 = $('#selector1');
var jSelector2 = $('.selector2');

Because, the following doesn't work:

jSelector1,jSelector2.bind(...);

nor does:

$jSelector1,$jSelector2.bind(...);
($jSelector1,$jSelector2).bind(...);
(jSelector1,jSelector2).bind(...);

This is how to bind multiple events on a couple jQuery selectors:

$('#selector1,.selector2').bind('event', function (e, ui) {
   // Stuff
});

But! How do you bind on predeclared jQuery objects. Example:

var jSelector1 = $('#selector1');
var jSelector2 = $('.selector2');

Because, the following doesn't work:

jSelector1,jSelector2.bind(...);

nor does:

$jSelector1,$jSelector2.bind(...);
($jSelector1,$jSelector2).bind(...);
(jSelector1,jSelector2).bind(...);

• javascript
• jquery
• event-handling
• jquery-selectors
• css-selectors

• and I'm not looking for jAllSelectors = $('#selector1,.selector2'); – Kyle Cureau Commented Aug 8, 2010 at 21:30

3 Answers 3

This should work, assuming your variables hold jQuery objects

$.each([jSelector1, jSelector2], function(i,v) {

    v.bind( ... );

});

you should be able to do something like this:

var jSelector1 = $('#selector1');
var jSelector2 = $('.selector2');

$.each([jSelector1, jSelector2], function(index, value) { 
  value.bind(....); 
});

Or you can use .add().

var jSelector1 = $('#selector1'),
    jSelector2 = $('.selector2'),
    jSelector3 = $('.selector3');

jSelector1.add(jSelector2).add(jSelector3).bind('whatever', function() {
  doSomethingAwesome();
});