JSFiddle - React, Tailwind, and code Playground

by dpnminh

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.1/jquery.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.3/js/select2.min.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.3/css/select2.min.css">
<select id="el3">

</select>
<button onClick="click()">
ClickMe
</button>

CSS

select, button{
  display:block;
}

JavaScript

function makeid()
{
    var text = "";
    var possible = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789";

    for( var i=0; i < 5; i++ )
        text += possible.charAt(Math.floor(Math.random() * possible.length));

    return text;
}

function getText(){
	var div = document.getElementById('test');
  
  div.innerHTML = makeid();
}

var fields = [];

    for (var i = 0; i < 100; i++){
      fields.push({
        text: makeid(),
        id: makeid(6)
      });
    }

$('#el3').select2(
{
		width: 'off',
          placeholder: "Select me",
          multiple: true,
          tokenSeparators: [",", " "],
          data: fields
        
});