Is there an “exists” function for jQuery?

Question

How can I check the existence of an element in jQuery?

The current code that I have is this:

if ($(selector).length > 0) {
    // Do something
}

Is there a more elegant way to approach this? Perhaps a plugin or a function?

Answer 1

How about:

function exists(selector) {
    return $(selector).length;
}

if (exists(selector)) {
    // do something
}

It's very minimal and saves you having to enclose the selector with $() every time.

Answer 2

You can use this:

// if element exists
if($('selector').length){ /* do something */ }

---

// if element does not exist
if(!$('selector').length){ /* do something */ }

Answer 3

You can use:

if ($(selector).is('*')) {
  // Do something
}

A little more elegant, perhaps.

Answer 4

No need for jQuery

if(document.querySelector('.a-class')) {
  // do something
}

Answer 5

I had a case where I wanted to see if an object exists inside of another so I added something to the first answer to check for a selector inside the selector..

// Checks if an object exists.
// Usage:
//
//     $(selector).exists()
//
// Or:
// 
//     $(selector).exists(anotherSelector);
jQuery.fn.exists = function(selector) {
    return selector ? this.find(selector).length : this.length;
};

Answer 6

You can save a few bytes by writing:

if ($(selector)[0]) { ... }

This works because each jQuery object also masquerades as an array, so we can use the array dereferencing operator to get the first item from the array. It returns undefined if there is no item at the specified index.