JSFiddle - React, Tailwind, and code Playground

by Kabir Hossain

HTML

<script src="http://harvesthq.github.io/chosen/chosen.jquery.js"></script>
<link rel="stylesheet" href="http://harvesthq.github.io/chosen/chosen.css">
<input type="text" value="1" id="t1pladdcount" />
    <span id="t1plcount">1</span>
<br/>

<div id="t1pls">
    <select class="chosen-select">
        <option value="0"></option>
        <option value="11">Player 1</option>
        <option value="12">Player 2</option>
        <option value="13">Player 3</option>
    </select>
</div>

<button id="t1addpl">Add Player</button>

CSS

.chosen-select{
    width: 32%;
}

JavaScript

$(document).ready(function () {
    $(".chosen-select").chosen();

    $("#t1addpl").click(function () {
           $("#t1pls").append('</br><select class="chosen-select t1pl1">\n\
                    <option value="0"></option>\n\
                    <option value="11">Player 1</option>\n\
                    <option value="12">Player 2</option>\n\
                    <option value="13">Player 3</option>\n\
                </select>');
            $(".chosen-select").chosen();
    });
});