JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/select2/3.5.2/select2.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/select2/3.5.2/select2.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/select2/3.5.2/select2-bootstrap.css">
<select class="select">
    <option value="1">One</option>
    <option value="1">Uno</option>
    <option value="2">Two</option>
    <option value="2">Dos</option>
    <option value="3">Three</option>
    <option value="3">Tres</option>
</select>

CSS

.select {
    width: 400px;
}

JavaScript

var $select = $('.select');

$select.select2();

var $option = $select.children().eq(1);
$select.select2('data', { id: $option.val(), text: $option.text() });

console.log('$select.val(): ' + $select.val());