jQuery - how to check if two elements are the same?

Question

I need to pass an element to a function and then match that specific element while traversing parent. The catch (for someone clueless like me) is that this element doesn't have an id. In the following example, I want every element to turn pink except the one clicked on that should turn yellow

function colorize(element) {     element.parent().find('span').each(function() {         if ($(this)===element) { // the problem is this is always false             $(this).css('background','yellow');         } else {             $(this).css('background','pink');         }     }); } $('span').click(function() {     colorize($(this)); }); 

Answer 1

Comparing JQuery objects will never return true, because each JQuery object is a a new object, even if their selectors are equal.

To compare elements, you have to check whether the DOM elements are equal:

this === element.get(0); 

Answer 2

You can use the jQuery is() function. The original answer can be found here.

function colorize(element) {     element.parent().find('span').each(function() {         if ( $(this).is(element) ) {             $(this).css('background','yellow');         } else {             $(this).css('background','pink');         }     }); }