JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.5/css/select2.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.5/js/select2.min.js"></script>
<button>123</button>

CSS

.select2-dropdown--below {
  display: none;
}

.select2-container--default.select2-container--open.select2-container--below .select2-selection--single,
.select2-container--default.select2-container--open.select2-container--below .select2-selection--multiple {
  border-bottom-right-radius: 3px;
  border-bottom-left-radius: 3px;
}

JavaScript

$('button').click(function() {
  var template = `
<select style="width: 80%;" class="js-example-basic-multiple" 	name="states[]" multiple="multiple">
</select>
  `;

  var el = $(template);
  $('body').append(el);
  el.select2({
    tags: true,
    tokenSeparators: [',', ' ']
  });
});


$('.js-example-basic-multiple').select2({
  tags: true,
  tokenSeparators: [',', ' ']
});