JSFiddle - React, Tailwind, and code Playground

by Anderson Pereira

HTML

<div id="container">
      <button id="create">Create Select</button>
    </div>

CSS

#container{
      width: 100%;
      background: #DADADA;
    }

JavaScript

var button =  document.getElementById("create");
  button.addEventListener("click", createSelect);

  function createSelect(){
      var i;
      var select = document.createElement("select");
      select.id ="select";
      document.getElementById("container").appendChild(select);
      for(i=0; i<20; i++){
        var option = document.createElement("option")
        option.text = "Option " + i;
        select.add(option);
      }
      setTimeout(expandSelect, 1000);
    }
    
    function expandSelect(){
      var element = document.getElementById("select");
      var event = new MouseEvent("click");
      element.dispatchEvent(event);
    }