Getting the selected text from a select list using jQuery selector

Question

I'm trying to get the selected text from a dropdown using a selector. If I reference the dropdown directly by name it works:

$('#aBigLongASP.NETWebformsGeneratedName_ddl_StateOfOption :selected').text()

I am however trying to use a selector to select the dropdown using only the last part of the name:

$('#select[id$='ddl_StateOfOption']) :selected).text();

but I can't quite seem to get it to work. The Chrome developer tool throws the following error:

SyntaxError: Unexpected identifier

Can anyone point out where the error is?

Answer 1

Try this:

$('select[id$="ddl_StateOfOption"] :selected').text();

There were several problems with your code:

// $('#select[id$='ddl_StateOfOption']) :selected).text();
//    ^           ^                 ^ ^          ^
//    |           |                 | |           \
//    |           |                 |  \            missing closing '
//    |           \                 /   shouldn't have )
//    \            should be " not '
//     You were selecting elements with id "select" rather than tag "select"

Answer 2

$("#select[id$='ddl_StateOfOption'] :selected").text();

try this one.