Selecting an <option> from a <select> with JavaScript in Google Chrome -

i'm trying have javascript listen event option chosen. , once javascript knows i've clicked 1 of options, it's supposed update how submit button functions. similar old fashioned onclick="" inline each option, in safer setting(which doesn't seem work in chrome). small bit of code, , works in firefox, ie, but not chrome.

html:

                <select>                     <option id="zero">--</option>                     <option id="one">choice one</option>                     <option id="two">choice two</option>                     <option id="three">choice three</option>                   </select>                    <button id="submit">submit</button> 

javascript:

        function _(el) {     return document.getelementbyid(el); } function resetoption() {     _('submit').setattribute('onclick', '');     _('submit').value = "choose location";  } function optiononechosen() {     _('submit').setattribute('onclick', 'functionone()');     _('submit').value = "location one"; } function optiontwochosen()  {     _('submit').setattribute('onclick', 'functiontwo()');     _('submit').value = "location two";    } function optionthreechosen()  {     _('submit').setattribute('onclick', 'functionthree()');     _('submit').value = "location three";    }          document.addeventlistener('domcontentloaded', function () {      _('zero').addeventlistener('click', resetoption);     _('one').addeventlistener('click', optiononechosen);     _('two').addeventlistener('click', optiontwochosen);     _('three').addeventlistener('click', optionthreechosen); }); 

i tried debugging, , seems system breaks inside 'domcontentloaded' function, if chrome doesn't recognize property i'm trying access. missing? or matter, chrome implementing security features other browsers haven't standardized yet? ton! jeffrey

this yield same result:

var select = document.queryselector("select"),     button = document.queryselector("button");  select.addeventlistener("change", function(e) {     var option = this.options[this.selectedindex];      switch (option.id) {         case "zero": button.value = "choose location"; break;         case "one": button.value = "location one"; break;         case "two": button.value = "location two"; break;         case "three": button.value = "location three"; break;     } }); 

fiddle