How to disable button if dynamic textbox are empty

I have disabled my submit button to avoid submission when textbox are not filled. I have multiple dynamic textbox where the function works correctly. But upon adding another row of textboxes, the submit button is already enabled. How can I still disable the textboxes when the user decides to add another row? I need the submit button to be enabled whenever all the textboxes are filled, after and before adding another row.

<html> 
<head> 
<script> 
function addRow(){
	var table = document.getElementById("bod");
	var rowCount = table.rows.length;
	var row = table.insertRow(rowCount);

	row.insertCell(0).innerHTML = '<input type="text" name="purpose_dy[]" id="purpose" size="20" onkeyup="success()"/>';
	row.insertCell(1).innerHTML = '<input type="text" name="wafernum_dy[]" id="wafernum" size="20" onkeyup="success()"/>';
	row.insertCell(2).innerHTML = '<input type="text" name="cell_dy[]" id="cell" size="20" onkeyup="success()"/>';
	row.insertCell(3).innerHTML = '<input type="text" name="qty_dy[]" id="qty" size="20" onkeyup="success()"/>';	
	row.insertCell(4).innerHTML = '<input type="text" name="remarks_dy[]" id="remarks" size="20" onkeyup="success()"/>';
	row.insertCell(5).innerHTML = '<input type="button" value="Delete" onClick="Javacsript:deleteRow(this)"/>';
}	

function success() {
	 if(document.getElementById("uname").value==="" || document.getElementById("age").value==="" || document.getElementById("purpose").value==="" || document.getElementById("wafernum").value==="" || document.getElementById("cell").value==="" || document.getElementById("qty").value==="" || document.getElementById("remarks").value==="") { 
            document.getElementById('submit_form').disabled = true; 
			
        } else { 
            document.getElementById('submit_form').disabled = false;
			document.getElementById('submit_form').style.backgroundColor="yellow";
        }
    }
</script> 

<style> 

</style></head> 

<body> 
Name: <input type="text" id="uname" />
Age: <input type="text" id="age" />
<input type= "button" id= "add" value="Add" onclick= "Javascript:addRow();" >
<table id= "bod">
    <tr>
		<th>PURPOSE</th>
		<th>WAFERNUM</th>
		<th>CELL</th>
		<th>QTY</th>
		<th>REMARKS</th>
    </tr>
</table>
<input type = "submit" name = "submit" id= "submit_form" value = "Submit" onclick="SaveData()" disabled>
</body> 
</html>

Solution

Alright i fixed your error , you had some issues where you were enbaling the button and disabling , its always better to itrate and check through the loop rather than going and checking if every element is empty , check the bellow answer and the fiddle . let me know if it works . The edited script part is below , replace it with yours it should work .

      <script>
function addRow() {
  var table = document.getElementById("bod");
  var rowCount = table.rows.length;
  var row = table.insertRow(rowCount);

  row.insertCell(0).innerHTML = '<input type="text" name="purpose_dy[]" class = "uname" id="purpose" size="20" onkeyup="success()"/>';
  row.insertCell(1).innerHTML = '<input type="text" name="wafernum_dy[]" class = "wafernum" id="wafernum" size="20" onkeyup="success()"/>';
  row.insertCell(2).innerHTML = '<input type="text" name="cell_dy[]" class = "cell" id="cell" size="20" onkeyup="success()"/>';
  row.insertCell(3).innerHTML = '<input type="text" name="qty_dy[]" class = "qty" id="qty" size="20" onkeyup="success()"/>';
  row.insertCell(4).innerHTML = '<input type="text" name="remarks_dy[]" class = "remarks" id="remarks" size="20" onkeyup="success()"/>';
  row.insertCell(5).innerHTML = '<input type="button" value="Delete" onClick="Javacsript:deleteRow(this)"/>';
}

function success() {
// get all the elements present in form
var unameArray = document.getElementsByClassName("uname");
var ageArray = document.getElementsByClassName("age");
var cellArray = document.getElementsByClassName("cell");
var qtyArray = document.getElementsByClassName("qty");
var wafernumArray = document.getElementsByClassName("wafernum");
 var purposeArray = document.getElementsByClassName("purpose");
var remarksArray = document.getElementsByClassName("remarks");
// Check for number of tr
var rowCount = document.getElementById("bod").rows.length;
var bt = document.getElementById('submit_form');
var ele = document.getElementsByTagName('input'); 
for(var i=0;i<ele.length;i++) {


   if (ele[i].type == 'text' && ele[i].value == '') {
            bt.disabled = true;    // Disable the button.
            return false;
        }
        else {
            bt.disabled = false;   // Enable the button.
        }
}

}

</script>