[jquery] jquery count li elements inside ul -> length?

If a ul has more than one li-element inside of it, something should happen, otherwise not!

What am I doing wrong?

if ( $('#menu ul').length > 1 ) {

If you have a dom object of the ul, use the following.

$('#my_ul').children().length;

A simple example

window.setInterval(function() {_x000D_
  let ul = $('#ul');                 // Get the ul_x000D_
  let length = ul.children().length; // Count of the child nodes._x000D_
_x000D_
  // The show!_x000D_
  ul.append('<li>Item ' + (length + 1) + '</li>');_x000D_
  if (5 <= length) {_x000D_
    ul.empty();_x000D_
    length = -1;_x000D_
  }_x000D_
  $('#ul_length').text(length + 1);_x000D_
}, 1000);

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>_x000D_
_x000D_
<h4>Count of the child nodes: <span id='ul_length'>0</span></h4>_x000D_
<ul id="ul"></ul>

Another approach to count number of list elements:

var num = $("#menu").find("li").length;_x000D_
if (num > 1) {_x000D_
  console.log(num);_x000D_
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>_x000D_
<ul id="menu">_x000D_
  <li>Element 1</li>_x000D_
  <li>Element 2</li>_x000D_
  <li>Element 3</li>_x000D_
</ul>

Warning: Answers above only work most of the time!

In jQuery version 3.3.1 (haven't tested other versions)

$("#myList li").length; 

works only if your list items don't wrap. If your items wrap in the list then this code counts the number of lines occupied not the number of <li> elements.

$("#myList").children().length;

gets the actual number of <li> elements in your list not the number of lines that are occupied.

Use $('ul#menu').children('li').length

.size() instead of .length will also work

You have to count the li elements not the ul elements:

if ( $('#menu ul li').length > 1 ) {

If you need every UL element containing at least two LI elements, use the filter function:

$('#menu ul').filter(function(){ return $(this).children("li").length > 1 })

You can also use that in your condition:

if ( $('#menu ul').filter(function(){ return $(this).children("li").length > 1 }).length) {

alert( "Size: " + $( "li" ).size() );

alert( "Size: " + $( "li" ).length );

Both .size() and .length return number of item. but size() method is deprecated (JQ 1.8). .length property can use for instead of size().

also you can use

alert($("ul").children().length);

Working jsFiddle

Please use .size() function instead of .length and also specify li tag in selector.

Change your code like.

if ( $('#menu ul li').size() > 1 ) {

The correct syntax is

$('ul#menu li').length

Make the following change:

console.log($("#menu li").length);

alert( "Size: " + $("li").size() ); 

or

alert( "Size: " + $("li").length );

You can find some examples of the .size() method here.