Shafeeque S
Shafeeque S

Reputation: 2613

How to get the number of tags having certain property using jquery?

I have a HTML like:

<div id="abc">
 <li></li>
 <li style="display: none;">lorem ipsum</li>
 <li></li>
 <li style="display: none;">lorem ipsum</li>
 <li></li>
</div>

I want to get the count of "li" tags under the "abc id" having style="display: none;". How can I do this?

Upvotes: 0

Views: 28

Answers (3)

kapantzak
kapantzak

Reputation: 11750

var getInvisibleLi = function(id) {
  return $('#' + id).find('li').not(':visible').length;
}

alert(getInvisibleLi('abc'));
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script>
<div id="abc">
 <li>test</li>
 <li style="display: none;">lorem ipsum</li>
 <li>test</li>
 <li style="display: none;">lorem ipsum</li>
 <li>test</li>
</div>

Upvotes: 0

Dhara Parmar
Dhara Parmar

Reputation: 8101

You can use :hidden to get all display:none elements. do:

 $( "#abc" ).find( ":hidden" ).length

Upvotes: 1

Anoop Joshi P
Anoop Joshi P

Reputation: 25527

You can use .not(":visible") method for that.

$("#abc li").not(":visible").length

Fiddle

Upvotes: 2

Related Questions