if-not condition fails (jQuery) [duplicate]

Question

This question already has answers here:

Check if element exists in jQuery [duplicate] (8 answers)

Closed 9 years ago.

http://jsbin.com/zexix/1/

$(function() {

    if ( !$(".first.last") ) {
      console.log("div with both first and last classes does not exists")
    } else {
      console.log("it exists");
    }

});

I want to check if a div with both first and last classes DOES NOT exist, but the check fails.

Answer 1

You need to check the number of elements found, as jQuery returns an empty collection in the event of no elements being found (which evaluates to a truthy value in the if statement):

if ( !$(".first.last").length )

I'd suggest testing against 0 explicitly, rather than relying on a falsey value, though:

if ( $(".first.last").length === 0 )

Answer 2

You can simplify this by checking the first object that is returned from JQuery:

if (!$(".first.last")[0]){
    console.log("div with both first and last classes does not exists");
} else {
  console.log("it exists");
}

Answer 3

there are two ways:

1. check the length:

if ( !$(".first.last").length ) { // check the length if none returns 0 == false

2. check the visibility:

if ( !$(".first.last").is(':visible') ) { // returns boolean true/false