JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="https://cdn.datatables.net/r/dt/dt-1.10.9,fc-3.1.0,fh-3.0.0,rr-1.0.0,se-1.0.1/datatables.min.css">
<script src="https://cdn.datatables.net/r/dt/dt-1.10.9,fc-3.1.0,fh-3.0.0,rr-1.0.0,se-1.0.1/datatables.min.js"></script>

JavaScript

$('body').ready(
	function (){
		// create table
        
        var iNumRows = 5;
        var iNumCols = 5;

        var tr = document.createElement('tr');
        for (var j = 0; j < iNumCols; j++) {
            var th = document.createElement('th');
            th.innerHTML = "col " + j.toString();
            tr.appendChild(th);
        }
        var thead = document.createElement('thead');
        thead.appendChild(tr);

        var tbody = document.createElement('tbody');

        for (var i = 0; i < iNumRows; i++) {
            tr = document.createElement('tr');
            for (var j = 0; j < iNumCols; j++) {
                var td = document.createElement('td');
                td.innerHTML = "cell " + i.toString();
                tr.appendChild(td)
            }
            tbody.appendChild(tr);
        }
        
        var table = document.createElement("table");
        table.className = "display compact nowrap";
        table.cellspacing="0"
        table.appendChild(tbody);
        table.appendChild(thead);
        
  		// create my absolute div container
        var div = document.createElement("div");
		
        div.style.position = 'absolute';
        div.style.width = "500px";
        div.style.height = "500px";
        div.style.backgroundColor = '#FF0000';
        
        div.appendChild(table)
        
    	$('body').append(div);
        
        
        setTimeout( function (){

            $(table).DataTable({
                paging: false,
                ordering: false,
                //scrollX: true,
                scrollY: "100%",
                searching:false,
                fixedColumns: {
                    leftColumns: 1
                },

                columns: [
                    { "width": "10em" ,  className: "myRowHeaderClass" },
                    {className: "myRowHeaderClass" },
                    {className: "myRowHeaderClass" },
                    {className: "myRowHeaderClass" },
                   ...