JSFiddle - React, Tailwind, and code Playground

HTML

<table id="insSpecc" width="100%;">
    <div class="separator">
    <tr>
        <td><span>Product</span></td>
        <td><span>Mfd_date</span></td>
        <td><span>RRX(Qty)</span></td></tr></div>
     <tr>
         <td><select id="prod_name" name="prod_name">
             <option>Balloon</option>
             <option>Nachos</option>
             <option>Cola</option>
             
             </select></td>
<td><input type="text" id="mfd_date" name="mfd_date[]" size="5"/></td>
<td><input type="text" id="client_rrx" name="client_rrx[]" size="5">

        </td>
          <td>
              <button id="add_img" onClick="insSpec()">Add</button>
        </td>    
    </tr>
    </table>

JavaScript

function insSpec()
    {
    
 
    rl=document.getElementById("insSpecc").rows.length;
    var a=document.getElementById("insSpecc").insertRow(rl);
    var h=a.insertCell(0);
    var f=a.insertCell(1);
    var m=a.insertCell(2);
    var n=a.insertCell(3);
    h.innerHTML='<div class="separator"><select id="prod_name'+rl+'" name="prod_name"><option value="balloon">Balloon</option><option value="nachos">Nachos</option> <option value="cola">Cola</option></select>';
    f.innerHTML='<input type="text" name="mfd_date[]" id="mfd_date'+rl+'" size="5"  />';
    m.innerHTML='<input type="text" name="client_rrx[]"  id="client_rrx'+rl+'" size="5"  />';
    n.innerHTML='<button   class="del_img" onClick="delSpec(this)"/>Delete</button></div>';
 
    }
    

    function delSpec(node)
        {    
        r=node.parentNode.parentNode;
        r.parentNode.removeChild(r);
        
    
        }