[jquery] Get the selected value in a dropdown using jQuery.

My HTML is below. I need to get the selected value (Scheduled) using the <select> tag. How can this be done 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.

This question is related to jquery jquery-selectors

The answer is


$("#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.


Hello guys i am using this technique to get the values from the selected dropdown list and it is working like charm.

var methodvalue = $("#method option:selected").val(); 

The above solutions didn't work for me. Here is what I finally came up with:

$( "#ddl" ).find( "option:selected" ).text();           // Text
$( "#ddl" ).find( "option:selected" ).prop("value");    // Value

$('#availability').find('option:selected').val() // For Value 
$('#availability').find('option:selected').text() // For Text
or 
$('#availability option:selected').val() // For Value 
$('#availability option:selected').text() // For Text

I have gone through all the answers provided above. This is the easiest way which I used to get the selected value from the drop down list

$('#searchType').val() // for the value