JSFiddle - React, Tailwind, and code Playground

by Kesav Telaprolu

HTML

<script src="https://code.jquery.com/jquery-3.1.1.min.js"></script>
<script src="https://code.highcharts.com/highcharts.js"></script>

<div id="container" style="height:500;width:900;margin:auto"></div>

JavaScript

(Input=>{
        var htmlstring ='<div style="width:900;height:500;">'+
                '<div style="height:100;width:900px"><span id="title"></span><br><span id="subtitle"></span><br><div style="width:260px;margin-top:20px"><span id="charttitle"></span></div><span id="tabletitle" style="position:relative;"></span>'+
                '<div id="leftcolumn" style="border:1px solid white;float:left;min-height:400;color:white;width:440px;margin-top:15px">' +
                '    </div>' +
                '    <div id="rightcolumn" style="border:1px solid white;float:left;min-height:400;width:450;color:black;margin-top:15px">'+
                '</div> <div id="Footer" style="border-width:1.5px;border-bottom-style:solid;margin-top:10px;padding-left:10px;padding-top:5px;height:50px;background-color:lightgray;width:885px;float:left;">'+
                '<span id=LegendTag1 style="font-size:12px"></span><span id=LegendTag2 style="left:10px;position:relative;font-size:12px;"></span><span id=LegendTag3 style="font-size:12px;left:20px;position:relative;"></span>'+
                '<span style="left:150px;position:relative;font-size:12px;">Competitor Brands</span><span style="left:230px;position:relative;font-size:12px;">Portfolio Brands</span><br>'+
                '<div style="font-size:9px;padding-top:5px;float:left">Volume forecast provided for ballpark guidance purposes only – not to support financial planning / investment decisions<br>It is based on concept evaluation using early stage stimulus, a simplified marketing plan & estimated repeat components</div>'+
                '<div style="background-color:rgb(146,208,80);width:15px;height:15px;float:left;left:28px;position:relative;margin-top:5px"></div><span style="float:left;font-size:12px;left:33px;position:relative;padding-top:7px">> = 120</span>'+
                '<div style="background-color:rgb(72,154,30);width:15px;height:15px;float:left;left:40px;position:relative;margin-top:5px"></div><span...