JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://code.highcharts.com/highcharts.js"></script>
<div id="container"></div>

CSS

#chart {
  height: 400px;
  width: 100%;
}

#btn-holder {
  position: relative;
  height: 1px;
  width: 100%;
}

#compare-btn {
  font-size: 12px;
  position: absolute;
  right: 0;
  top: -34px;
}

JavaScript

$(function() {
  var data = [[{
    "day": "06/19/2016",
    "region": "Ohio",
    "daily_er": "98.61"
  }],[{
    "day": "06/19/2016",
    "region": "Western NE",
    "daily_er": "98.63"
  }],[{
    "day": "07/19/2016",
    "region": "Ohio",
    "daily_er": "68.61"
  }],[{
    "day": "07/19/2016",
    "region": "Western NE",
    "daily_er": "32.63"
  }],[{
    "day": "08/19/2016",
    "region": "Ohio",
    "daily_er": "98.61"
  }],[{
    "day": "08/19/2016",
    "region": "Western NE",
    "daily_er": "48.63"
  }]
]

  var exist, index, options = {
    xAxis: {
      categories: []
    },
    series: []
  }
  Highcharts.each(data, function(p, i) {
    for (var i = 0; i < p.length; i++) {
      exist = false;
      if (options.xAxis.categories.indexOf(p[i].day) < 0) {
        options.xAxis.categories.push(p[i].day)
      }
      Highcharts.each(options.series, function(s, j) {
        if (s.name === p[i].region) {
          exist = true;
          index = j;
        }
      });
      if (exist) {
        options.series[index].data.push(parseFloat(p[i].daily_er))
      } else {
        options.series.push({
          name: p[i].region,
          data: [parseFloat(p[i].daily_er)]
        })
      }
    }
  })
  $('#container').highcharts(options);
});