jQuery get select option text

Question

Alright, say I have this:

<select id='list'>
<option value='1'>Option A</option>
<option value='2'>Option B</option>
<option value='3'>Option C</option>
</select>

What would the selector look like if I wanted to get "Option B" when I have the value '2'. Please note that this is not asking how to get the selected text value, but just any one of them, whether selected or not, depending on the value attribute. I tried:

$("#list[value='2']").text();

But it is not working.

Answer 1

It's looking for an element with id list which has a property value equal to 2. What you want is the option child of the list.

$("#list option[value='2']").text()

Answer 2

Try the following:

$("#list option[value=2]").text();

The reason why your original snippet wasn't working is because your OPTION tags are children to your SELECT tag, which has the id list.

Answer 3

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

Answer 4

$("#list [value='2']").text();

leave a space after the id selector.

Answer 5

$("#list option:selected").each(function() {
   alert($(this).text());
}

for multiple selected value in the #list element.

Answer 6

Hi

Interesting. But how do I select an id instead of text. Basically what I'm trying to do is that when u select an option from the drop down above; it must pass an id of the selected option to a function that will fetch other data from a different table (we can even use an array its fine), then populates the second dropo down list ???

Answer 7

Wouldn't that be:

$("#list option:selected").attr('id');

Answer 8

Guys,dont forget this:change(fn)