What's the simplest way to add a drop down menu input in HTML5 and JS?

Question

I'm having issues with making a secondary input method for my website. I've made a drop down menu, but I can't figure out how to make it do anything.

function secondaryOutput() {

        }
    </script>
            <!--The <select> tag is a drop-down menu for a secondary input method.-->
            <select>
                <option value="1"; id="1"; onclick="secondaryOutput()"; class="Second">1</option>
                <option value="2"; id="2"; onclick="secondaryOutput()"; class="Second">2</option>
                <option value="3"; id="3"; onclick="secondaryOutput()"; class="Second">3</option>
                <option value="4"; id="4"; onclick="secondaryOutput()"; class="Second">4</option>
                <option value="5"; id="5"; onclick="secondaryOutput()"; class="Second">5</option>
                <option value="6"; id="6"; onclick="secondaryOutput()"; class="Second">6</option>
                <option value="7"; id="7"; onclick="secondaryOutput()"; class="Second">7</option>
                <option value="8"; id="8"; onclick="secondaryOutput()"; class="Second">8</option>
                <option value="9"; id="9"; onclick="secondaryOutput()"; class="Second">9</option>
                <option value="10"; id="10"; onclick="secondaryOutput()"; class="Second">10</option>
                <option value="11"; id="11"; onclick="secondaryOutput()"; class="Second">11</option>
                <option value="12"; id="12"; onclick="secondaryOutput()"; class="Second">12</option>
                <option value="13"; id="13"; onclick="secondaryOutput()"; class="Second">13</option>
                <option value="14"; id="14"; onclick="secondaryOutput()"; class="Second">14</option>
                <option value="15"; id="15"; onclick="secondaryOutput()"; class="Second">15</option>
                <option value="16"; id="16"; onclick="secondaryOutput()"; class="Second">16</option>
                <option value="17"; id="17"; onclick="secondaryOutput()"; class="Second">17</option>
                <option value="18"; id="18"; onclick="secondaryOutput()"; class="Second">18</option>
                <option value="19"; id="19"; onclick="secondaryOutput()"; class="Second">19</option>
                <option value="20"; id="20"; onclick="secondaryOutput()"; class="Second">20</option>
                <option value="21"; id="21"; onclick="secondaryOutput()"; class="Second">21</option>
                <option value="22"; id="22"; onclick="secondaryOutput()"; class="Second">22</option>
                <option value="23"; id="23"; onclick="secondaryOutput()"; class="Second">23</option>
                <option value="24"; id="24"; onclick="secondaryOutput()"; class="Second">24</option>
                <option value="25"; id="25"; onclick="secondaryOutput()"; class="Second">25</option>
                <option value="26"; id="26"; onclick="secondaryOutput()"; class="Second">26</option>
                <option value="27"; id="27"; onclick="secondaryOutput()"; class="Second">27</option>
                <option value="28"; id="28"; onclick="secondaryOutput()"; class="Second">28</option>
                <option value="29"; id="29"; onclick="secondaryOutput()"; class="Second">29</option>
                <option value="30"; id="30"; onclick="secondaryOutput()"; class="Second">30</option>
                <option value="31"; id="31"; onclick="secondaryOutput()"; class="Second">31</option>
                <option value="34"; id="34"; onclick="secondaryOutput()"; class="Second">34</option>
                <option value="35"; id="35"; onclick="secondaryOutput()"; class="Second">35</option>
                <option value="36"; id="36"; onclick="secondaryOutput()"; class="Second">36</option>
                <option value="37"; id="37"; onclick="secondaryOutput()"; class="Second">37</option>
                <option value="38"; id="38"; onclick="secondaryOutput()"; class="Second">38</option>
            </select>

When one of the items are selected, I want to have that item execute the function secondaryOutput(). I then want secondaryOutput() to identify which item executed it, and give that item's number in a variable.

Answer 1

Adding an onclick event in html for every option isn't a good idea. Use eventListener with change event instead. When the select value is changed, it will log the value or whatever you want into the console.

var select = document.getElementById('select');
select.addEventListener('change', function(){
  console.log(this.value);
});

<select id='select'>
   <option value="1" id="1" class="Second">1</option>
   <option value="2" id="2" class="Second">2</option>
   <option value="3" id="3" class="Second">3</option>
</select>