jQuery multiple selector with $(this)

Question

is there any way to make this work:

$(this, '#foo')

with that I want to select "this" element and #bar as well. For selecting let's say two IDs, it is just as easy as '#foo, #bar', but when I want one of those two to be "this" I cannot get it to work.

Answer 1

Problem with your approach

$(this, '#foo')

The above line will search for this inside an element with id set to foo, which isn't what you want here.

---

Solution

You can use add() for this :

var $el = $(this).add('#foo')

Now $el will contain $(this) & $("#foo") on which you can perform operations on.

---

More info on the methods used

add("selector")

• Docs : http://api.jquery.com/add/
• What it does : Add elements to the set of matched elements.

Answer 2

The problem with the approach you're using:

$(this, '#foo')

JS Fiddle demo.

Is that this is a context-aware selection, searching for this within the #foo element (and is identical to $('#foo').find(this)), which is valid within jQuery, though I'd imagine somewhat pointless (given that you already have a reference to this (I assume, though if not this might be the window)).

In all honesty I'm not entirely sure why the selector 'works' at all, unless given the this node jQuery simply discards the context, given that it already 'knows' where the this node is and has a reference.

To add to a selection:

$(this).add('#foo');

JS Fiddle demo.

Or (conversely):

$('#foo').add(this);

JS Fiddle demo.

References:

• add().
• find().
• jQuery selector-context.