JSFiddle - React, Tailwind, and code Playground

HTML

<head>
<script src="https://canvasjs.com/assets/script/canvasjs.min.js"></script>
<script type="text/javascript">
function adder() {
  let div;
  div = document.createElement('div');
  div.setAttribute('id', 'chartContainer');
  div.style.width = '100%';
  div.style.height = '300px';
  document.getElementById('toAdd').appendChild(div);
  CanvasJS.addColorSet("LabelColor",[ //colorSet Array
    "#223977"
  ]);
  var chart = new CanvasJS.Chart("chartContainer", {
    colorSet: "LabelColor",
    backgroundColor: "#ced8e5",
    axisX: {
      interval: 1,
    },
    title: {
      text: "My First Chart in CanvasJS"
    },
    toolTip: {
      content: "{p}%"
    },
    data: [{
      // Change type to "doughnut", "line", "splineArea", etc.
      type: "column",
      indexLabel: "{y}",
      dataPoints: [
        { y: 10, color: "red" },
        { y: 15, p: 5 }
      ]
    }]

  });
  chart.render();
}
</script>
</head>
<body>
  <div id="toAdd"><button onclick="adder()">add chart</button></div>
</body>