Home / Get the number of options in a select with jQuery

Get the number of options in a select with jQuery

This post looks at how to get the number of options that are in a select drop down box with jQuery, and also how to remove all current options from the drop down box. My next jQuery post will look at how to add new options to the select.

Working example

Use the buttons below to show the number of options in the select box in a popup dialog, then clear them, show the count again and use reset if you want to start over. This will not work if you are reading this in a feed reader so click through to view this post in a web browser.

Get the number of options in a select with jQuery

The <select> in the above example has an id of example, so is referenced in jQuery as #example. To show the number of options in an alert dialog as is done in the above example do this:

alert( $('#example option').length )

Clear the existing options in a select with jQuery

To clear all the options from the select use jQuery’s remove() function:

$('#example option').remove()

Adding new options and getting the currently selected value

My next jQuery post will look at a couple of ways to add new options to a select box with jQuery. To find out how to get the currently selected value read my how to get and set form element  values with jQuery post.