JSFiddle - React, Tailwind, and code Playground

HTML

<div id="em-navigation">
  <ul class="em-navigation-list"></ul>
  <div class="em-iframe">
    <iframe src="https://www.google.de" width="200" height="200">
    </iframe>
  </div>
</div>

JavaScript

var gameData = [
	{
  	"date":"2016/06/09",
    "time":"13:00", 
    "name": "Deutschland - Ukraine", 
    "id": "mu01"
  },
	{
  	"date":"2016/07/09",
    "time":"14:00", 
    "name": "Italien - Polen", 
    "id": "mu02"
  },
  {
  	"date":"2016/07/09",
    "time":"17:00", 
    "name": "Frankreich - Wales", 
    "id": "mu03"
  },
  {
  	"date":"2016/07/09",
    "time":"18:00", 
    "name": "Frankreich - Wales", 
    "id": "mu04"
  },
];


var d = new Date(),
		month = d.getMonth() + 1,
		day = d.getDate(),
		date = d.getFullYear() + '/' + (month < 10 ? '0' : '') + month + '/' + (day < 10 ? '0' : '') + day,
    timeHours = d.getHours(),
		time = d.getHours() + ":" + d.getMinutes(),
    timeLog = 0,
    iframeURL = "http://www.spiegel.de",
    dataId = "";
    
jQuery.each(gameData, function(index, gameData) {
	var myTime = gameData.time;
  if (gameData.date === date) {
  	var navigationHtml = "<li data-id=" + gameData.id + ">" + gameData.time + "</li>";
  	jQuery("#em-navigation").find(".em-navigation-list").append(navigationHtml);
  }
  
	if (gameData.date === date && parseInt(timeHours, 10) < parseInt(myTime, 10) && timeLog === 0) {
  	alert("if1: " + index + ", " + gameData.date + gameData.time + gameData.name + gameData.id);
    dataId = gameData.id;
    timeLog = 1;
  }
  else if (gameData.date === date && parseInt(timeHours, 10) >= parseInt(myTime, 10)) {
  	alert("if2: " + index + ", " + gameData.date + gameData.time + gameData.name + gameData.id);
  	dataId = gameData.id;
    timeLog = 1;
  }
  
  var gameDataLength = gameData.id.length;
  if (parseInt(index, 10) === parseInt(gameDataLength, 10) - 1) {
  	alert(dataId);
  	frameUrl(dataId);
  }
});

function frameUrl(dataId) {
	jQuery(".em-iframe").find("iframe").attr("src", iframeURL + dataId);
  if (dataId === "") {
  	jQuery(".em-iframe").html("es ist gerade Spielfrei");
  }
};

jQuery(".em-navigation-list").find("li").on("click", function() {
	var dataId =...