JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/v/bs/dt-1.10.15/af-2.2.0/b-1.3.1/b-colvis-1.3.1/b-flash-1.3.1/cr-1.3.3/fc-3.2.2/fh-3.1.2/kt-2.2.1/rg-1.0.0/rr-1.2.0/sc-1.4.2/se-1.2.2/datatables.min.css"/>
 
<script type="text/javascript" src="https://cdn.datatables.net/v/bs/dt-1.10.15/af-2.2.0/b-1.3.1/b-colvis-1.3.1/b-flash-1.3.1/cr-1.3.3/fc-3.2.2/fh-3.1.2/kt-2.2.1/rg-1.0.0/rr-1.2.0/sc-1.4.2/se-1.2.2/datatables.min.js"></script>

  <table id="MyTable" class="table table-bordered  ">

                                                    <thead>
                                                    <tr>
                                                        <th id="tdbicim">ID</th>
                                                        <th id="tdbicim">Data One</th>
                                                        <th id="tdbicim">Data Two</th>
                                                       
                                                    </tr>
                                                    </thead>


                                                    <tbody id="MyTbody">

                                                    </tbody>



                                                </table>

JavaScript

var MyTbody=document.getElementById("MyTbody");


$('#MyTable').DataTable({
            "paging": false,
            "lengthChange": false,
            "searching": false,
            "ordering": true,
            "info": false,
            "autoWidth": false,
            "rowReorder": true
        });
        
        
        var Row=document.createElement("tr");
        var Column=document.createElement("td");
        Column.appendChild(document.createTextNode("1"));
        Row.appendChild(Column);
        
        Column=document.createElement("td");
        Column.appendChild(document.createTextNode("Data One Column"));
        Row.appendChild(Column);
        
        Column=document.createElement("td");
        Column.appendChild(document.createTextNode("Data Two Column"));
        Row.appendChild(Column);
        
        MyTbody.appendChild(Row);
        
        
        Row=document.createElement("tr");
        Column=document.createElement("td");
        Column.appendChild(document.createTextNode("2"));
        Row.appendChild(Column);
        
        Column=document.createElement("td");
        Column.appendChild(document.createTextNode("Data One Column"));
        Row.appendChild(Column);
        
        Column=document.createElement("td");
        Column.appendChild(document.createTextNode("Data Two Column"));
        Row.appendChild(Column);
        
        MyTbody.appendChild(Row);
        
        
        Row=document.createElement("tr");
        Column=document.createElement("td");
        Column.appendChild(document.createTextNode("3"));
        Row.appendChild(Column);
        
        Column=document.createElement("td");
        Column.appendChild(document.createTextNode("Data One Column"));
        Row.appendChild(Column);
        
        Column=document.createElement("td");
        Column.appendChild(document.createTextNode("Data Two Column"));
        Row.appendChild(Column);
        
        MyTbody.appendChild(Row);