jQuery show element if not empty

Question

I have the following jQuery code:

var agencyToolbar = $('#agency-header-toolbar');
if ($(":not(:empty)", agencyToolbar)) {
    agencyToolbar.show();
}

The code above works, but I wasn't sure if it's a proper way to use a jQuery selector.

Maybe you want to simply ask if ($('#agency-header-toolbar')) { ... — zed
– zed, Commented Apr 16, 2015 at 19:28
@zed: Your code will always result in "truthy". Same mistake as the original code. You probably meant to add .length == 0 as in $('#agency-header-toolbar').length === 0 or !$('#agency-header-toolbar').length. — iCollect.it Ltd
– iCollect.it Ltd, Commented Apr 17, 2015 at 8:56

iCollect.it Ltd · Accepted Answer · 2015-04-17 08:54:06Z

1

Your code will always fire the show as $(":not(:empty)", agencyToolbar) creates a jQuery object which is never null so is always "truthy".

You wanted to use is (which returns a boolean result) like

if (agencyToolbar.is(':not(:empty))')){

or use a single selector like

$("#agency-header-toolbar:not(:empty)").show();

If you need it to be a tad faster, do the id selector first as its own operation, then filter it with not()

$("#agency-header-toolbar").not(":empty").show();

answered Apr 17, 2015 at 8:54

iCollect.it Ltd

93.9k26 gold badges189 silver badges210 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

kvn · Accepted Answer · 2015-04-16 20:00:42Z

1

Assuming that you want to select #agency-header-toolbar which are not empty. It is more simpler to use

var agencyToolbar = $("#agency-header-toolbar:not(:empty)");
agencyToolbar.show();

answered Apr 16, 2015 at 20:00

kvn

2,3005 gold badges25 silver badges49 bronze badges