JSFiddle - React, Tailwind, and code Playground

HTML

<div id="MarketBox3" class="MarketBox" style="top: 205px;">
<div id="TimeBox3Cont" class="TimeBox"><h3 id="TimeBox3" style="color: white; text-     shadow: 0px 0px 5px #000; letter-spacing: 1px; font-size: 12px;"></h3></div>
<div id="TimeBar3" class="TimeBar" style="left: 300px; width: 300px;" onmouseover="javasript:function f(){ $('#intext3').text('bla bla');} f(); " onmouseout="javasript:function g(){ $('#intext3').text('1111');} g(); ">
<div id="MarketName3" class="MarketName">
<div id="inbox3" style="position: absolute; top: -2px; height: 30px; width: 300px;">
<h3 id="intext3" style="color: white; text-shadow: 0px 0px 2px #000; letter-spacing: 1px; font-size: 16px;">Frankfurt - Germany</h3>
</div>
</div>
</div>
</div>