<p>This gets the value of whatever is selected in my dropdown menu.</p>

<pre><code>document.getElementById('newSkill').value
</code></pre>

<p>I cannot however find out what property to go after for the text that's currently displayed by the drop down menu. I tried "text" then looked at <a href="http://w3schools.com/" rel="noreferrer">W3Schools</a> but that didn't have the answer, does anybody here know?</p>

<p>For those not sure, here's the HTML for a drop down box.</p>

<pre><code>&lt;select name="newSkill" id="newSkill"&gt;
    &lt;option value="1"&gt;A skill&lt;/option&gt;
    &lt;option value="2"&gt;Another skill&lt;/option&gt;
    &lt;option value="3"&gt;Yet another skill&lt;/option&gt;
&lt;/select&gt;
</code></pre>

[{'answer_id': 5921, 'author': 'Brian Childress', 'author_id': 721, 'author_profile': 'https://Stackoverflow.com/users/721', 'pm_score': 1, 'selected': False, 'text': '<p>Does this get the correct answer? </p>\n\n<pre><code>document.getElementById("newSkill").innerHTML\n</code></pre>\n'}, {'answer_id': 5924, 'author': 'Thejesh GN', 'author_id': 482, 'author_profile': 'https://Stackoverflow.com/users/482', 'pm_score': 3, 'selected': False, 'text': "<pre><code>document.getElementById('newSkill').options[document.getElementById('newSkill').selectedIndex].value \n</code></pre>\n\n<p>Should work</p>\n"}, {'answer_id': 5939, 'author': 'Tanerax', 'author_id': 567, 'author_profile': 'https://Stackoverflow.com/users/567', 'pm_score': 3, 'selected': False, 'text': "<p>This should return the text value of the selected value</p>\n\n<pre><code>var vSkill = document.getElementById('newSkill');\n\nvar vSkillText = vSkill.options[vSkill.selectedIndex].innerHTML;\n\nalert(vSkillText);\n</code></pre>\n\n<p>Props: @Tanerax for reading the question, knowing what was asked and answering it before others figured it out.</p>\n\n<p>Edit: DownModed, cause I actually read a question fully, and answered it, sad world it is.</p>\n"}, {'answer_id': 5947, 'author': 'Patrick McElhaney', 'author_id': 437, 'author_profile': 'https://Stackoverflow.com/users/437', 'pm_score': 8, 'selected': True, 'text': '<p>Based on your example HTML code, here\'s one way to get the displayed text of the currently selected option:</p>\n\n<pre><code>var skillsSelect = document.getElementById("newSkill");\nvar selectedText = skillsSelect.options[skillsSelect.selectedIndex].text;\n</code></pre>\n'}, {'answer_id': 14665677, 'author': 'Lilith', 'author_id': 1533141, 'author_profile': 'https://Stackoverflow.com/users/1533141', 'pm_score': 2, 'selected': False, 'text': '<p>This works i tried it my self i thought i post it here in case someone need it...</p>\n\n<pre><code>document.getElementById("newSkill").options[document.getElementById(\'newSkill\').selectedIndex].text;\n</code></pre>\n'}, {'answer_id': 23616510, 'author': 'raton', 'author_id': 1770154, 'author_profile': 'https://Stackoverflow.com/users/1770154', 'pm_score': 0, 'selected': False, 'text': "<pre><code>    var ele = document.getElementById('newSkill')\n    ele.onchange = function(){\n            var length = ele.children.length\n            for(var i=0; i&lt;length;i++){\n                if(ele.children[i].selected){alert(ele.children[i].text)};              \n            }\n    }   \n</code></pre>\n"}, {'answer_id': 32887007, 'author': 'shekh danishuesn', 'author_id': 5291660, 'author_profile': 'https://Stackoverflow.com/users/5291660', 'pm_score': 2, 'selected': False, 'text': '<p>Attaches a change event to the select that gets the text for each selected option and writes them in the div.</p>\n\n<p>You can use jQuery it very face and successful and easy to use</p>\n\n<pre><code>&lt;select name="sweets" multiple="multiple"&gt;\n  &lt;option&gt;Chocolate&lt;/option&gt;\n  &lt;option&gt;Candy&lt;/option&gt;\n  &lt;option&gt;Taffy&lt;/option&gt;\n  &lt;option selected="selected"&gt;Caramel&lt;/option&gt;\n  &lt;option&gt;Fudge&lt;/option&gt;\n  &lt;option&gt;Cookie&lt;/option&gt;\n&lt;/select&gt;\n&lt;div&gt;&lt;/div&gt;\n\n\n$("select").change(function () {\n  var str = "";\n\n  $("select option:selected").each(function() {\n    str += $( this ).text() + " ";\n  });\n\n  $( "div" ).text( str );\n}).change();\n</code></pre>\n'}, {'answer_id': 35123258, 'author': 'Debanjan Roy', 'author_id': 5086165, 'author_profile': 'https://Stackoverflow.com/users/5086165', 'pm_score': 0, 'selected': False, 'text': '<pre><code>var selectoption = document.getElementById("dropdown");\nvar optionText = selectoption.options[selectoption.selectedIndex].text;\n</code></pre>\n'}, {'answer_id': 36276432, 'author': 'IbrahimSediq', 'author_id': 6127529, 'author_profile': 'https://Stackoverflow.com/users/6127529', 'pm_score': 0, 'selected': False, 'text': '<p>Please try the below this is the easiest way and it works perfectly</p>\n\n<pre><code>var newSkill_Text = document.getElementById("newSkill")[document.getElementById("newSkill").selectedIndex];\n</code></pre>\n'}, {'answer_id': 44130853, 'author': 'BOBIN JOSEPH', 'author_id': 4238869, 'author_profile': 'https://Stackoverflow.com/users/4238869', 'pm_score': 4, 'selected': False, 'text': '<p>Simply You can use jQuery instead of JavaScript</p>\n<pre><code>$(&quot;#yourdropdownid option:selected&quot;).text();\n</code></pre>\n<p>Try This.</p>\n'}, {'answer_id': 46924743, 'author': 'Muhammad Tariq Ahmed Khan', 'author_id': 8829462, 'author_profile': 'https://Stackoverflow.com/users/8829462', 'pm_score': 2, 'selected': False, 'text': '<pre><code>function getValue(obj)\n{  \n   // it will return the selected text\n   // obj variable will contain the object of check box\n   var text = obj.options[obj.selectedIndex].innerHTML ; \n\n}\n</code></pre>\n\n<p>HTML Snippet </p>\n\n<pre><code> &lt;asp:DropDownList ID="ddl" runat="server" CssClass="ComboXXX" \n  onchange="getValue(this)"&gt;\n&lt;/asp:DropDownList&gt;\n</code></pre>\n'}, {'answer_id': 54680935, 'author': 'Manpreet Singh Dhillon', 'author_id': 3495713, 'author_profile': 'https://Stackoverflow.com/users/3495713', 'pm_score': 2, 'selected': False, 'text': "<p>Here is an easy and short method</p>\n\n<pre><code>document.getElementById('elementID').selectedOptions[0].innerHTML\n</code></pre>\n"}, {'answer_id': 67819800, 'author': 'RayH', 'author_id': 16084726, 'author_profile': 'https://Stackoverflow.com/users/16084726', 'pm_score': 0, 'selected': False, 'text': "<p>Found this a tricky question but using ideas from here I eventually got the solution using PHP &amp; Mysqli to populate the list : and then a bit of javascript to get the working variable out.</p>\n<pre><code>        &lt;select  id=&quot;mfrbtn&quot; onchange=&quot;changemfr()&quot; &gt;   \n        &lt;option selected=&quot;selected&quot;&gt;Choose one&lt;/option&gt;\n            &lt;?php\n            foreach($rows as $row)\n                {\n                echo '&lt;option   value=implode($rows)&gt;'.$row[&quot;Mfrname&quot;].'&lt;/option&gt;';\n                 }\n              ?&gt;\n          &lt;/select&gt;\n</code></pre>\n<p>Then :</p>\n<pre><code>&lt;script language=&quot;JavaScript&quot;&gt;\n    \n    function changemfr()\n    {\n     var $mfr2=document.getElementById(&quot;mfrbtn&quot;).selectedOptions[0].text;\n     alert($mfr2);\n    }\n&lt;/script&gt;\n</code></pre>\n"}]
['https://Stackoverflow.com/questions/5913', 'https://Stackoverflow.com', 'https://Stackoverflow.com/users/1384652/']