Fento
Fento

Reputation: 61

JQuery - Hide Div when p is empty with multiple instances

I'm trying to hide a div when the user doesn't enter text into a p field within that div - I can do this using :empty easily enough but the page has multiple instances of the same div so it hides them all if just one of the p is empty - I think I can fix this using an 'else' but can't get it to work...

My markup:

<div class="sticker"><a href="#linkhere"><p class="circletext">Some text</p></a></div>

My js:

if ($('.circletext').is(':empty')){
$('.sticker').hide();
} else { 
$('.sticker').show();
}

Would appreciate any help :) Cheers

Upvotes: 1

Views: 71

Answers (1)

Musa
Musa

Reputation: 97717

Firstly only select the empty ps then only hide the divs they are in.

$('.circletext').filter(':empty').closest('.sticker').hide();

Upvotes: 1

Related Questions