JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.4/themes/ui-lightness/jquery-ui.css">
    <div style="width:50%;">
    <input type="hidden" value="0" id="theValue" />
    <p><button onclick="addEvent();">Add Product</button></p>
    <div id="myDiv"> 
     
    
    </div>
    </div>

JavaScript

function addEvent()
    {
        var ni = document.getElementById('myDiv');
        
        var numi = document.getElementById('theValue');
        var num = (document.getElementById("theValue").value -1)+ 2;
        numi.value = num;
        var divIdName = "my"+num+"Div";
        var newdiv = document.createElement('div');
        newdiv.setAttribute("id",divIdName);
        //var tab_id = 1;
        var tab_id = "tab"+num;
        var tab_child = 0;
        
        newdiv.innerHTML = "<table class='tab_inc' width='100%' name='mult_tab' id='tab"+num+"'><tr id='row_"+num+"_"+tab_child+"'><td><input type='text' id='client_prod' name='client_prd'></td>"+"<td><input type='text' id='client_trx' name='client_trx'></td>" +"<td><input type='text' id='client_qty' name='client_qty[]'></td>"+"<td><input type='text' id='client_mrp' name='client_mrp[]'></td>"+"<td><button onClick='ins_Row("+num+");'>Add</button><button id='remove_"+ num + "_" + tab_child +"' onclick=\"removeElement("+num+","+ tab_child + ")\">Remove"+"</button></td></tr></table>";
        
        ni.appendChild(newdiv);
    
  
    }
 function removeElement(num1,rownum) {
     if(rownum == 0)
     {
         var d = document.getElementById('myDiv');
         var olddiv = document.getElementById("my"+num1+"Div");
         d.removeChild(olddiv);
     }
     else
     {
         var row = document.getElementById('row_'+num1+'_'+rownum);
         row.parentNode.removeChild(row);
         if($("[id^=row_"+num1+"]").length==1)
         {
             $("#remove_"+ num1 + "_0").show();
         }
     }
    
    }
        
function ins_Row(tab_id)
    {
        var childElems = $("[id^=row_"+tab_id+"]");
        var maxLength = 0;
        for(var i=0;i<childElems.length;i++)
        {
            if(maxLength<parseInt(childElems[i].id.split("_")[2],10))
               maxLength = parseInt(childElems[i].id.split("_")[2],10);
        }
        maxLength++;
        var tr = document.createElement("tr");
       ...