JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://s3-eu-west-1.amazonaws.com/widget.cloud.opta.net/2.0/js/widgets.opta.js"></script>
<script type="text/javascript">
  var _optaParams = {
    custID: '36e6dfe9c21df3bc4b6aa071111d2172',
    language: 'en'
  };

</script>

<div>
  <div>
    <select id="comps" name="comps"></select>
  </div>
  <div>
    <select id="teams" name="teams"></select>
  </div>
  <div id="content"></div>
</div>

CSS

div {
  font-family: 'Arial';
  font-size: 0.9em;
}

JavaScript

// -------------------- CONSTANTS --------------------
const SEASON = "2015";
const SPORT_ID = "1";
const SPORT = "football";

// -------------------- HELPER --------------------
function splitTrans(a) {
	var out = [], a = a.split("¦");
	for (var b = 0; b < a.length; b++) {
    var c = a[b].split("|");
    if (c[1] && c[1].length>0) {
    	out.push({id:c[0],full:c[1],short:c[2],abbr:c[3]});
    }
  }
  return out;
}

function addElement(values, delim, el, id) {
		delim = delim || '', id = id || 'content', el = el || 'div';
		var elem = document.createElement(el);
    elem.innerHTML = values.join(delim);
    document.getElementById(id).appendChild(elem);
}

// -------------------- COMPETITIONS --------------------
var compDef = new $jqOpta.Deferred;
compDef.resolveWith = function(a, b) { a.done(b[0].d); };
compDef.done = function(a) {
	var comps = splitTrans(a);
  comps.forEach(function(comp) {
  	var option = document.createElement("option");
    option.innerHTML = comp.full, option.value = comp.id;
    document.getElementById('comps').appendChild(option);
  });
};

// -------------------- TEAMS --------------------
var teamDef = new $jqOpta.Deferred;
teamDef.resolveWith = function(a, b) { a.done(b[0].d); };
teamDef.done = function(a) {
	var teams = splitTrans(a);
  a = a.split("¦");
  // remove all children
  var c = document.getElementById('teams');
  while (c.firstChild) { c.removeChild(c.firstChild); }
  for (var k in teams) {
  	var option = document.createElement("option");
    option.innerHTML = teams[k].full, option.value = teams[k].id;
    document.getElementById('teams').appendChild(option);
  }
};

// -------------------- COMPS ONCHANGE --------------------
document.getElementById('comps').onchange = function (e) {
	var c = document.getElementById('comps');
  var cid = c.options[c.selectedIndex].value;
  ctParams.competition = String(cid);
  
  var teamRequest = new $jqOpta.FeedRequest(
    $jqOpta.FeedRequest.FEED_TRANS_TEAM,
    ctParams,
   ...