JQuery Multiple selectors, $(this) reference?

Question

given the following

$("#identifier div:first, #idetifier2").fadeOut(300,function() {
  // I need to reference just the '#identifier div:first' element
  // however $(this) will grab both selectors
});

Is there a better way to go about this other than just calling $("#identifier div:first") again?

Answer 1

No, it'll call the function for each handle separately.

The comma in your selector is equivalent to saying:

$("#identifier div:first").fadeOut(300,function() {
  // $(this) -> '#identifier div:first'
  });

$("#idetifier2").fadeOut(300,function() {
   // $(this) -> '#identifier2'
});

You can check by saying (untested):

$("#identifier div:first, #idetifier2").fadeOut(300,function() {
  if($(this).is("#identifier div:first")  {
     // do something
  }
});

However, if you want to do different things (as what seems from your post), its better to attach them separately.