CODEWITHSUNDEEP
javascriptjqueryhtml
jankoritak
jankoritak

Reputation: 595

jQuery referencing created element

I'm rather confused, what is the difference between elementsWrapper1 and elementsWrapper2? Shouldn't the last log expression evaluate as true?

HTML:

<div class="container">
  <div class="element"></div>
  <div class="element"></div>
  <div class="element"></div>
</div>

JS (jQuery):

var container = $('.container');

var elementsWrapper1 = $('<div>', {
    class : 'elements-wrapper'
});

container.children().wrapAll(elementsWrapper1);

var elementsWrapper2 = $('.elements-wrapper');

console.log(elementsWrapper1);
console.log(elementsWrapper2);

//Returns False, but why?
console.log(elementsWrapper1 === elementsWrapper2)

Thanks

Upvotes: 1

Views: 28

Answers (1)

Barmar
Barmar

Reputation: 780929

Every time you call $(), either to create an object (as you did with elementsWrapper1) or perform a selection (as with elementsWrapper2), it creates a new jQuery object. Even if two jQuery objects refer to the same collection of DOM elements, they're not the same Javascript object, so === will consider them non-equal.

If you want to test whether two jQuery objects are equivalent, you can use the .is() method.

console.log(elementsWrapper1.is(elementsWrapper2));

See jQuery object equality

Upvotes: 1

Related Questions