Counting the number of option tags in a select tag in jQuery

$('#input1 option').length; 

This will produce 2.

The W3C solution:

var len = document.getElementById("input1").length; 

You can use either length property and length is better on performance than size.

$('#input1 option').length; 

OR you can use size function like (removed in jQuery v3)

$('#input1 option').size(); 

$(document).ready(function(){ console.log($('#input1 option').size()); console.log($('#input1 option').length); });

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> <select data-attr="dropdown" id="input1"> <option value="Male" id="Male">Male</option> <option value="Female" id="Female">Female</option> </select>

Your question is a little confusing, but assuming you want to display the number of options in a panel:

<div id="preview"></div> 

and

$(function() { $("#preview").text($("#input1 option").length + " items"); }); 

Not sure I understand the rest of your question.

In a multi-select option box, you can use $('#input1 :selected').length; to get the number of selected options. This can be useful to disable buttons if a certain minimum number of options aren't met.

function refreshButtons () { if ($('#input :selected').length == 0) { $('#submit').attr ('disabled', 'disabled'); } else { $('#submit').removeAttr ('disabled'); } } 

The best form is this

$('#example option').length 

Ok, i had a few problems because i was inside a

$('.my-dropdown').live('click', function(){ }); 

I had multiples inside my page that's why i used a class.

My drop down was filled automatically by a ajax request when i clicked it, so i only had the element $(this)

so...

I had to do:

$('.my-dropdown').live('click', function(){ total_tems = $(this).find('option').length; }); 

This is giving the count of all the available options exactly as the question asked. Its useful if you already have the node in a variable

Another approach that can be useful.

$('#select-id').find('option').length