title: Simulate click event on select (not working for IE and FF)
body: <p>I want to simulate click event on select using button. I have inspired through the following link.
  <a href="https://stackoverflow.com/questions/13234971/simulate-click-on-select-element-with-jquery">Simulate click on select element with jQuery</a></p>
  
  <p>On above thread this fiddle is working fine for chrome. I am facing an issue with same behavior for firefox and Internet explorer.</p>
  
  <p>I have edited the fiddle. This is fiddle but it seems it is not working. In this fiddle I am able to get into the function but actual click event is not firing on select. I am missing pieces of code and because of that my code is not working. Any help with fill in the blanks.</p>
  
  <p>here is HTML code.</p>
  
  <pre><code>&lt;select id="dropdown"&gt;
  &lt;option value="Red"&gt;Red&lt;/option&gt;
  &lt;option value="Green"&gt;Green&lt;/option&gt;
  &lt;option value="Blue"&gt;Blue&lt;/option&gt;
  &lt;/select&gt;
  &lt;br&gt;
  &lt;button id="fire" type="button" onclick="runThis()"&gt;Show dropdown items&lt;/button&gt;
  </code></pre>
  
  <p>This is Javascript.</p>
  
  <pre><code>// &lt;select&gt; element displays its options on mousedown, not click.
  showDropdown = function (element) {
  var event;
  event = document.createEvent('MouseEvents');
  event.initMouseEvent('mousedown', true, true, window);
  element.dispatchEvent(event);
  }; 
  
  // This isn't magic.
  window.runThis = function () { 
  var dropdown = document.getElementById('dropdown');
  //showDropdown(dropdown);
  eventFire(dropdown, 'click');
  };
  function eventFire(el, etype) {
  alert('hi');
  if (el.fireEvent) {
      el.fireEvent('on' + etype);
      el[etype]();
  } else {
      var evObj = document.createEvent('Events');
      evObj.initEvent(etype, true, false, window);
      el.dispatchEvent(evObj);
  }
  }
  </code></pre>
  
  <p>Also I found couple of references for the same kind of operation.</p>
  
  <p>HTML file</p>
  
  <pre><code>    &lt;button&gt;Trigger the link below&lt;/button&gt;&lt;br /&gt;
      &lt;a href="http://www.yahoo.com/"  target="_blank"&gt;
      http://www.google.com/&lt;/a&gt; (new window)
      &lt;br&gt;
          &lt;select id="dropdown"&gt;
      &lt;option value="Red"&gt;Red&lt;/option&gt;
     &lt;option value="Green"&gt;Green&lt;/option&gt;
     &lt;option value="Blue"&gt;Blue&lt;/option&gt;
     &lt;/select&gt;
  </code></pre>
  
  <p>This is javascript file.</p>
  
  <pre><code>function eventFire(el, etype) {
  alert('hi');
  if (el.fireEvent) {
      el.fireEvent('on' + etype);
      el[etype]();
  } else {
      var evObj = document.createEvent('Events');
      evObj.initEvent(etype, true, false);
      el.dispatchEvent(evObj);
  }
  }
  
  document.getElementsByTagName("button")[0].onclick = function() {
  var element = document.getElementsByTagName("select")[0];
  eventFire(element, "click");
  };
  </code></pre>
  
  <p>This above fiddle is also not working.
  Please let me know if any more information needed.</p>
  
  <p>Above fiddle I am referencing from stackoverflow itself. Because of my account limitation I can not paste direct link.</p>