Get selected value of a dropdown's item using jQuery

How can I get the selected value of a dropdown box using jQuery?
I tried using

var value = $('#dropDownId').val();

and

var value = $('select#dropDownId option:selected').val();

but both return an empty string.


For single select dom elements, to get the currently selected value:

$('#dropDownId').val();

To get the currently selected text:

$('#dropDownId :selected').text();

var value = $('#dropDownId:selected').text()

Should work fine, see this example:

$(document).ready(function(){ 
  $('#button1').click(function(){ 
    alert($('#combo :selected').text());
  });
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select id="combo">
  <option value="1">Test 1</option>
  <option value="2">Test 2</option>
</select>
<input id="button1" type="button" value="Click!" />

Try this jQuery,

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

or this javascript,

 var selID=document.getElementById("ddlid");
 var text=selID.options[selID.selectedIndex].text;

If you need to access the value and not the text then try using val() method instead of text().

Check out the below fiddle links.

Demo1 | Demo2


try this

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