Triggering mousedown on select element

Since I can't trigger a click or mousedown on the <select> element, need to do something like this.

by totszwai

HTML

<select id="test">
    <option>hello</option>
    <option>world</option>
</select>
<p><a href="#" id="remote">click</a></p>

JavaScript

$(document).ready(function() {

    $("#test").on({
        "click" : function(event) {
           console.log("clicked"); 
        },
        "mousedown" : function(event) {
           console.log("mousedowned");
        }
    });
    
    $("#remote").on({
        "click" : function() {
            //$("#test").trigger("click");
            //$("#test").trigger("mousedown");
            var element = $("#test")[0];
                worked = false;
            if(document.createEvent) { // all browsers
                var e = document.createEvent("MouseEvents");
                e.initMouseEvent("mousedown", true, true, window, 0, 0, 0, 0, 0, false,       false, false, false, 0, null);
                worked = element.dispatchEvent(e);
            } else if (element.fireEvent) { // ie
                worked = element.fireEvent("onmousedown");
            }
            if (!worked) { // unknown browser / error
                alert("It didn't worked in your browser.");
            }
        }
    });    
    
});