Hi I want to count LI which does not have the UL , for the first level only, but when I count this it shows size 4 instead of 2, its count the inner LI also.
&l
Not sure if I'm reading right, but ..
$('ul.first-level > li:not(:first)').length
Returns 2 for me (see demo)
You can use the child selector >
to target only child elements directly under the parent.
jQuery(document).ready(function(){
var nosubnav = jQuery('.first-level > li:not(:has(ul))');
var nosubnavsize = jQuery('.first-level > li:not(:has(ul))').size();
jQuery(nosubnav).css('border' , '1px solid red');
alert('List item which does not have submenu '+nosubnavsize);
});
This will return the count of 2. You can also optimise this slightly by reusing your stored selection of the target li (stored in nosubnav
):
jQuery(document).ready(function(){
var nosubnav = jQuery('.first-level > li:not(:has(ul))');
nosubnav.css('border' , '1px solid red');
alert('List item which does not have submenu '+nosubnav.length);
});
This will cut out the overhead of querying the DOM a second time.
$('.first-level > li:not(:has(ul))').size()