CODEWITHSUNDEEP
javascriptjqueryhide
geraddavis
geraddavis

Reputation: 355

jQuery hide only the empty element

I'm working on a tagging feature and the wrapping element for the tag (span class="tag") is showing without content. I need to hide the empty one and show the tags with content. The problem is my logic is affecting all the tags, not just the empty one. How can I target just the empty tag?

 $(".tag:empty").hide();
        $('.tag_btn').live('click', function() {
             if (!$('.tag:empty')){
                 $('.tag').show();
             }
        });

Upvotes: 0

Views: 472

Answers (2)

SeanCannon
SeanCannon

Reputation: 77956

EDIT: Ok so when you click .tag_btn, you want to display all the non-empty .tags ? Try this: 

$('.tag_btn').live('click', function() 
{
    $('.tag:not(:empty)').show();
});

Upvotes: 1

ElonU Webdev
ElonU Webdev

Reputation: 2459

I'm not sure what could be going on, but would this alternate way work?

$('.tag').each(function(){
    var tag = $(this);
    if ($.trim(tag.text() != ""))
    {
        tag.show();
    }
});

Upvotes: 0

Related Questions