JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="https://s3.amazonaws.com/flexmonster/2.3/demo.css">
<script src="https://cdn.flexmonster.com/flexmonster.js"></script>

<div id="pivots"></div>

<button id="clicky">clicky</button>

JavaScript

var report = {
  dataSource: {
    dataSourceType: "mondrian",
    proxyUrl: "http://127.0.0.1:50006",
    catalog: "FoodMart",
    cube: "Sales",
    binary: true
  },
  "slice": {
    "rows": [{
uniqueName: "[Product]",
      "sort": "asc"
    }],
    "columns": [{
        "uniqueName": "[Store]",
        "sort": "asc"
      },
      {
        "uniqueName": "[Measures]"
      }
    ],
    "measures": [{
        "uniqueName": "[Measures].[Profit]",
        "aggregation": "none",
        "active": true
      },
      {
        "uniqueName": "[Measures].[Customer Count]",
        "aggregation": "none",
        "active": true
      },
      {
        "uniqueName": "[Measures].[Sales Count]",
        "aggregation": "none",
        "active": true
      }
    ]
  }
}


var i = 0;

document.getElementById('clicky').addEventListener('click', () => {
	i++
  
	var div = document.createElement('div')
  div.id = 'pivot-container-'+i
	document.getElementById('pivots').appendChild(div)
  
	var pivot1 = new Flexmonster({
  	container: "#pivot-container-"+i,
  	componentFolder: "https://cdn.flexmonster.com/",
  	width: "100%",
  	height: 300,
  	report: report
	});


})