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;
    
    //newdiv.setAttribute("width");
    newdiv.innerHTML = "<table class='tab_inc' width='100%' name='mult_tab' id='tab"+num+"'><tr><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 onclick=\"removeElement(\'"+divIdName+"\')\">Remove"+"</button></tr></table>";
    ni.appendChild(newdiv);
    
  
    }
 function removeElement(divNum) {
    var d = document.getElementById('myDiv');
    var olddiv = document.getElementById(divNum);
    d.removeChild(olddiv);
    }
        
function ins_Row(tab_id)
    {
 
 

    rl=document.getElementById(tab_id).rows.length;
    var a=document.getElementById(tab_id).insertRow(rl);
    var h=a.insertCell(0);
    var f=a.insertCell(1);
    var m=a.insertCell(2);
    var n=a.insertCell(3);
    var o=a.insertCell(4);
    var p=a.insertCell(5);
    var q=a.insertCell(6);
    var r=a.insertCell(7);
    
    n.innerHTML='<input type="text" name="competitor_prod[]"  id="competitor_prod'+rl+'" style="width:120px;"  />';
    o.innerHTML='<input type="text" name="competitor_mrp[]"  id="competitor_mrp'+rl+'" size="5"  />';
    p.innerHTML='<input type="text" name="competitor_nrx[]"  id="competitor_nrx'+rl+'" size="5"  />';
    q.innerHTML='<input type="text" name="competitor_rrx[]"  id="competitor_rrx'+rl+'" size="5"  />';
    r.innerHTML='<img src="<?php echo...