How to get the selected label from a html <select> ?

Question

HTML Javascript question

to get the selected value of a input-select I can use

<select id="gender" name="gender" class="style12">
    <option selected="selected">ALL</option>
    <option>Male Only</option>
    <option>Female Only</option>
</select>

document.getElementById('gender').value

is there any easy way for me to get the selected label (i.e. ALL / Male Only / Female Only) with javascript?

Thanks a lot for reading.

Answer 1

var el = document.getElementById('gender');
var text = el.options[el.selectedIndex].text;

Answer 2

This should work:

var label = document.getElementById('gender')[document.getElementById('gender').selectedIndex].innerHTML;