JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://ivaynberg.github.io/select2/select2-3.3.2/select2.js"></script>
<link rel="stylesheet" href="http://ivaynberg.github.io/select2/select2-3.3.2/select2.css">
<select name="convert-to" id="convert-to" multiple>
    <option value="AUD">AUD - Australian Dollar</option>
    <option value="USD">USD - US Dollar</option>
    <option value="JPY">JPY - Japanese Yen</option>
    <option value="EUR">EUR - Euro</option>
    <option value="GBP">GBP - British Pound</option>
    <option value="CAD">CAD - Canadian Dollar</option>
    <option value="HKD">HKD - Hong Kong Dollar</option>
</select>

JavaScript

$('select').select2({
     width: 300
 }).change(function () {
     var options = $('.select2-search-choice > div');
     i = 1;
     Array.prototype.forEach.call(options, function(o) {         
         o.id = 'choice'+i;                // optional, creating ids to
         i++;                              // find it easily if you want
 
         aux = o.textContent.split(" - "); // Divide value from text
         o.textContent = aux[0];           // Get first part, i.e, value
         console.log(aux);
     })}
).trigger('change');