HTML5 datalists - displaying list of options programmatically

Question

I'm new to HTML5 datalists. I have setup an <input type="text"> tied to a <datalist> following:

• HTML datalist Tag - W3Schools
• HTML5 Datalist: What You Need To Know - The JotForm Blog

For instance:

<input list="browsers" name="browser">
<datalist id="browsers">
    <option value="Internet Explorer">
    <option value="Firefox">
    <option value="Chrome">
    <option value="Opera">
    <option value="Safari">
</datalist>

Chrome / Chromium shows the input as a combobox, allowing one to list all the possible values:

Firefox displays the input as any other text field, but I realized one can display all the options double clicking the field, or clicking the field and pressing the down arrow key:

I need to implement a browser-agnostic button that shows that list of options when it is clicked. Like:

<input list="browsers" name="browser">
<datalist id="browsers">
    <option value="Internet Explorer">
    <option value="Firefox">
    <option value="Chrome">
    <option value="Opera">
    <option value="Safari">
</datalist>
<button type="button">Show options</button>

How can I implement such a button?

Tindle

Wow, a thorough internet search has given me no answers. I've tried everything I know in javascript to simulate clicks or autofocus on the datalist... nothing works. My best advice is to simply use a placeholder attribute, or maybe a framework like Bootstrap to add a fancy label to your list that lets people know what's up. – Yen

That's why I asked on Stack Overflow :) – Terminology

And StackOverflow is stumped too, looks like. #16134161 ... If simply using a placeholder or label is not a viable solution, you'll have to build your own custom selector using jQuery or something. – Yen

What I already tried: simulating pressing the down arrow key, but it did not work. More info here: #10456126 – Terminology