JSFiddle - React, Tailwind, and code Playground
HTML
<form id="form1" name="form1" method="post" action="">
<div id="addCom" style="width:100%">
<div id="1">
<table class='table1' width="100%" border="0" cellpadding="0" cellspacing="2">
<tr>
<td width="25%" valign="top">Original Quantity</td>
<td width="27%" valign="top"><input type="text" name="ori_qty[]" onBlur="calculate()" /></td>
<td width="24%" valign="top"> </td>
<td width="24%" valign="top"> </td>
</tr>
<tr>
<td valign="top">Quantity 1</td>
<td valign="top"><input type="text" name="qty_1[]" id="qty_1[]" />
</td>
<td valign="top">Quantity 2</td>
<td valign="top"><input type="text" name="qty_2[]" id="qty_2[]" /></td>
</tr>
</table>
</div>
</div>
<a href="javascript:new_combi()">Add Calculation</a>
</form>
<!-- REPEAT FIELDS -->
<div id="var_roo_fields" style="display:none">
<div>
<hr />
<table class='table1' width="100%" border="0" cellpadding="0" cellspacing="2">
<tr>
<td width="25%" valign="top">Original Quantity</td>
<td width="27%" valign="top"><input type="text" name="ori_qty[]" onBlur="calculate()" /></td>
<td width="24%" valign="top"> </td>
<td width="24%" valign="top"> </td>
</tr>
<tr>
<td valign="top">Quantity 1</td>
<td valign="top"><input type="text" name="qty_1[]" id="qty_1[]" />
</td>
<td valign="top">Quantity 2</td>
<td valign="top"><input type="text" name="qty_2[]" id="qty_2[]" /></td>
</tr>
</table>
</div>
</div>
JavaScript
window.calculate = function(){
for(var i=1; i<=ct; i++){
var currentDiv = document.getElementById(i);
var ori_qty = currentDiv.getElementsByTagName('input')[0].value;
var total = Math.round(ori_qty/0.8);
currentDiv.getElementsByTagName('input')[1].value = total;
currentDiv.getElementsByTagName('input')[2].value = total;
};
}
var ct = 1;
window.new_combi = function(){
ct++;
var div1 = document.createElement('div');
div1.id = ct;
// link to delete extended form elements
var delLink = '<div style="text-align:right;margin-right:65px"><a href="javascript:delIt('+ ct +')">Delete</a></div>';
div1.innerHTML = document.getElementById('var_roo_fields').innerHTML + delLink;
document.getElementById('addCom').appendChild(div1);
}
window.delIt =function (eleId){
d = document;
var ele = d.getElementById(eleId);
var parentEle = d.getElementById('addCom');
parentEle.removeChild(ele);
}