JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="http://cdnjs.cloudflare.com/ajax/libs/select2/4.0.0/css/select2.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.0/js/select2.min.js"></script>
<select style="width: 80%" class="select2" multiple="multiple"></select>
<br/><br/>
<button id="clickme">get values</button>

JavaScript

$(".select2").select2({
  ajax: {
    url: "https://api.github.com/search/repositories",
    dataType: 'json',
    delay: 250,
    data: function (params) {
      return {
        q: params.term,
        page: params.page
      };
    },
    processResults: function (data, page) {
      return {
        results: data.items
      };
    },
    cache: true
  },
  escapeMarkup: function (markup) { return markup; }, 
  minimumInputLength: 1,
  templateResult: function(repo) { 
    return repo.name + ' (' + repo.full_name + ')';
  },
  templateSelection: function(repo) { 
    return repo.name + ' (' + repo.full_name + ')';
  }
});
$('#clickme').on('click', function() { 
    console.log($('.select2').val()); 
});