JSFiddle - React, Tailwind, and code Playground

HTML

<script src="//code.jquery.com/jquery-1.11.0.min.js"></script>
<script src="http://code.highcharts.com/highcharts.js"></script>
<script src="http://code.highcharts.com/highcharts-more.js"></script>
<script src="http://code.highcharts.com/modules/exporting.js"></script>
<div id="container" style="min-width: 310px; height: 600px; margin: 0 auto"></div>

JavaScript

$(function () {


            //split time record for yAxsis
            var timeforchartandgrid = '';

            function timsesubstringforXaxis(timechart) {

                var res = timechart;


                // var dateres = timechart.substring(0, 10);
                var timeArray = res.split(':');
                var hours = timeArray[0];
                var minutes = timeArray[1];
                var secnds = timeArray[2];

                if (hours == 12) {
                    hours = 12;
                } else if (hours > 12) {
                    hours = '0' + hours % 12;
                } else {
                    hours = hours;
                }

                timeforchartandgrid = hours + ':' + minutes + ':' + secnds;
                return timeforchartandgrid;

            }
            //,{"name" :"avgpr_main  -F","st_date" :"10/1/2014","ed_date" :"10/1/2014","st_time_am_pm" :" pm","ed_time_am_pm" :" pm","intervals": [{ "from": 53865000,"to": 54006000,"label": "completed","color" : "#63CA00"}]}
            var arraylist = '[{"name" :"finwts_main  -1","st_date" :"04/9/2015","ed_date" :"04/9/2015","st_time_am_pm" :" am","ed_time_am_pm" :" am","intervals": [{ "from": 1431160907000,"to": 1431160955000,"label": "completed","color" : "#63CA00"}]},{"name" :"finwts_main  -2","st_date" :"04/9/2015","ed_date" :"04/9/2015","st_time_am_pm" :" am","ed_time_am_pm" :" am","intervals": [{ "from": 1431160966000,"to": 1431160984000,"label": "completed","color" : "#63CA00"}]},{"name" :"finwts_main  -3","st_date" :"04/9/2015","ed_date" :"04/9/2015","st_time_am_pm" :" am","ed_time_am_pm" :" am","intervals": [{ "from": 1431160994000,"to": 1431161314000,"label": "completed","color" : "#63CA00"}]},{"name" :"impr_main  -prod","st_date" :"04/9/2015","ed_date" :"04/9/2015","st_time_am_pm" :" am","ed_time_am_pm" :" am","intervals": [{ "from": 1431161334000,"to": 1431171728000,"label": "completed","color" : "#63CA00"}]},{"name" :"taxupdt_th  -P","st_date"...