JSFiddle - React, Tailwind, and code Playground

by it_turns_out

HTML

<script src="http://people.iola.dk/olau/flot/jquery.flot.js"></script>
<script src="http://cdnjs.cloudflare.com/ajax/libs/flot/0.8.2/jquery.flot.categories.min.js"></script>
<div class="portlet-title">
	<div class="caption">
		<i class="fa fa-bullhorn"></i>Revenue
	</div>
	<div class="actions">
		<div class="btn-group" data-toggle="buttons" id="site_revenue_legend">
		</div>
	</div>
    <div id="site_revenue_loading">
		<img src="assets/admin/layout/img/loading.gif" alt="loading"/>
	</div>
	<div id="site_revenue_content" class="display-none">
		<div id="site_revenue" style="height: 228px;">
		</div>
	</div>
</div>

JavaScript

var Graphs = function () {

    return {

        //main function

        initCharts: function () {
            if (!jQuery.plot) {
                return;
            }

            function showChartTooltip(x, y, xValue, yValue) {
                $('<div id="tooltip" class="chart-tooltip">' + yValue + '<\/div>').css({
                    position: 'absolute',
                    display: 'none',
                    top: y - 40,
                    left: x - 40,
                    border: '0px solid #ccc',
                    padding: '2px 6px',
                    'background-color': '#fff'
                }).appendTo("body").fadeIn(200);
            }
            
            if ($('#site_revenue').size() != 0) {
                //site revenue
                var previousPoint2 = null;
                var plot_statistics = null;
                var data = [];
				
                togglePlot = function(seriesIdx)
                {
                  var previousPoint2 = plot_statistics.getData();
                  seriesIdx--;  // ***HERE***
                  previousPoint2[seriesIdx].points.show = // ***AND HERE***
                  previousPoint2[seriesIdx].lines.show = !previousPoint2[seriesIdx].lines.show;
                  plot_statistics.setData(previousPoint2);
                  plot_statistics.draw();
                }
				
                $('#site_revenue_loading').hide();
                $('#site_revenue_content').show();

		        var data = [{
                    label: "Gross Revenue",
                    color: ['#44b5b1'],
                    points: {
                        fillColor: "#44b5b1"
                    },
                    data: [
                        ['Sep', 264.41],
                        ['Aug', 6653.98],
                        ['Jul', 921.35],
                        ['Jun', 937.00],
                        ['May', 1839.25],
                        ['Apr', 1561.96],
                        ['Mar', 2289.62],
            ...