How to get the selected value in a dropdown using jQuery.

Question

Hi, i have a HTML like this. I need to get the selected value (here Scheduled) using the <select> tag. How to do that using jQuery.

<select id="availability" style="display: none;">
  <option value="Available">Available</option>
  <option selected="selected" value="Scheduled">Scheduled</option>
  <option value="Unavailable">Unavailable</option>
</select>

I did a jQuery("#availability") to get the select tag, but I do not know how to get the selected Options' value.

Thanks.

Answer 1

Try:

jQuery("#availability option:selected").val();

Or to get the text of the option, use text():

jQuery("#availability option:selected").text();

More Info:

• http://api.jquery.com/val/
• http://api.jquery.com/text/

Answer 2

$("#availability option:selected").text();

This will give you the text value of your dropdown list. You can also use .val() instead of .text() depending on what you're looking to get. Follow the link to the jQuery documentation and examples.