jQuery addClass example

Change class name on click in jQuery

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 >
  <div id="container"  style=" height:688px;width:900px;overflow-x: scroll;margin:auto;"></div>
</div>

JavaScript

( Input=>{
        var barlenght = Input.BrandIncrementalTrial.length;
        var chartWidth = ((barlenght* 90)+100) < 250 ? 250 : ((barlenght * 90)+100);
        console.log(chartWidth);
        var htmlstring ='<div style="height:100;width:900px;"><span id="title" style="margin-left:15px"></span><br><span id="subtitle" style="margin-left:15px"></span><br>'+
                '<div style="width:400px;margin-top:20px;margin-left:15px"><span id="charttitle"></span></div><span id="tabletitle" style="position:relative;"></span>'+
                '<div id="columnsymb"></div>'+
                '<div id="chartContainer" style=width:'+chartWidth+'px;></div>'+
                '<div id="charttable" style=width:'+chartWidth+100+'px;height:80px;padding-top:15px></div>'+
                '<div id="Footer" style="width: 990px;height: 38px; background-color: rgb(245,245,245);border-bottom: 1px solid black;"><div>'+
                '<img style="margin-left:10px;margin-right:5px" src="http://i66.tinypic.com/sbu91t.png" alt="Incremental" border="0" />'+
                '<span style="margin-right:5px">Incremental</span>'+
                '<img style=" margin-right:5px" src="http://i63.tinypic.com/vpkn52.png" alt="Competitor market share" border="0">'+
                '<span style="margin-right:5px">Brand Cannibalisation</span>'+
                '<img src="http://i65.tinypic.com/29fqcqs.png" style="height:10px;margin-right:5px;" alt="chosenbrandimage"  />'+
                '<span style="margin-right:5px;">Bottom 50%</span><img src="http://i64.tinypic.com/2qdpyu1.pn" style="height:10px;margin-right:5px;" alt="Bottom 50%"/>'+
                '<span style="margin-right:5px;">50 - 25%</span><img   src="http://i66.tinypic.com/164g2g.png" style="height:10px;margin-right:5px;" alt="chosenbrandimage"/>'+
                '<span style="margin-right:5px;">Top 25%</span><span style="margin-right:5px;color:red" border="0">---</span>'+
                '<span style="margin-right:5px"...