JSFiddle - React, Tailwind, and code Playground

HTML

<ul id="tabs">
    <li onclick="funk1()" ><a href="#" rel="div1">Test 1</a></li>
    <li onclick="funk2()" ><a href="#" rel="div2">Test 2</a></li>
    <li><a href="#" rel="div3">Test 3</a></li>
</ul>

<div id="panel_wrapper">
    <div id="div1" class="panel" >div 1</div>
    <div id="div2" class="panel ">div 2</div>
    <div id="div3" class="panel">div 3</div>
</div>

CSS

#panel_wrapper>div{
    padding:10px;
    background-color:yellow;
    width:200px;
    height:200px;
    margin: 20px 0;
    text-align: center;
    vertical-align: middle;
    line-height: 200px;
    border:1px solid black;
    display: none;
}

JavaScript

$("#tabs a").click(function (e) {
    e.preventDefault(); //preprecimo izvajanje default obnasanja
    $("#panel_wrapper div.panel").hide(); //skrijemo vse s classom "panel"
    var rel = $(this).attr('rel'); //dobimo ven rel vrednost
    $("#panel_wrapper div#"+rel).show(); //prikazemu ustrezni panel
});


$("#tabs a:eq(0)").trigger("click");

var currPic=1;
var curPos=0;

var keepTime;
        var myColor=new Array("red","green","blue","yellow");

function setupPicChange()
{ 
	if (ime==2) {
		delay=Math.floor(Math.random()*600)+2000; 
	}
	else if (ime==3) {
		delay=Math.floor(Math.random()*400)+1200; 
	}
	else  {
		delay=Math.floor(Math.random()*200)+600; 
	}
	keepTime=setTimeout("changePic()", delay); 
}

function changePic()
{
	if (curPos == 1)
	{

		ime=Math.floor(Math.random()*4);
		document.body.style.background-color="'"+myColor[ime]+"'";
		document.body.style.webkitTransition="background 0.5s ease";
		document.body.style.mozTransition="background 0.5s ease";
		document.body.style.oTransition="background 0.5s ease";
		document.body.style.transition="background 0.5s ease";
			
	}
	else if (curPos == 2)
	{
		document.body.style.background = "white";
		clearTimeout(keepTime);
	}


	setupPicChange(); 
	
}
function funk1()
{
    alert("funk1");
	curPos=1;
	changePic();
}
function funk2()
{
    alert("funk2");
	curPos=2;
}