JSFiddle - React, Tailwind, and code Playground

HTML

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

JavaScript

$(function () {
      var dataPie =[];
      var ground = [];
    var abc =[{"name":"Apples","load":"20"},{"name":"Oranges","load":"35"},{"name":"Pears","load":"15"},{"name":"Pineapples","load":"12"},{"name":"Grapes","load":"8"},{"name":"Bananas","load":"10"},{"name":"Peaches","load":"10"}];
 $.each(abc,function(i,el)
{
     if (el.name == "Apples"){
				dataPie.push({name: el.name, y: parseInt(el.load), drilldown: "tree"});
				ground.push({name: el.name, y: parseInt(el.load), color: "#4F81BD"});
			}else if (el.name == "Oranges"){
				dataPie.push({name: el.name, y: parseInt(el.load), drilldown: "tree"});
				ground.push({name: el.name, y: parseInt(el.load), color: "#00B050"});
			}else if (el.name == "Pears"){
				dataPie.push({name: el.name, y: parseInt(el.load), drilldown: "tree"});
				ground.push({name: el.name, y: parseInt(el.load), color: "#92D050"});
			}else{
				dataPie.push({name: el.name, y: parseInt(el.load), drilldown: "ground"});
			}
       
  });
    Highcharts.setOptions({
	     colors: ['#FF0000', '#7F7F7F', '#C00000', '#FFC000', '#4F81BD', '#00B050', '#92D050']
	    });
    var tree =  dataPie.filter(function(obj){ return obj.drilldown !== 'tree'; });
    $('#container').highcharts({
        chart: {
            plotBackgroundColor: null,
            plotBorderWidth: null,
            type: 'pie'
        },
        
        title: {
            text: "Fruity Pebbles",
            style: {
       			fontSize: '22px'
               }
        },
        exporting: {
            enabled: true,
            buttons: {
                contextButton: {
                    menuItems: [{
                        text: 'Export to PNG (small)',
                        onclick: function () {
                            this.exportChart({
                                width: 250
                            });
                        }
                    }, {
                        text: 'Export to PNG (large)',
                        onclick:...