Q:

Reload the total when removing a function - HTML & JS based form

Once a row/field has been added, the function below allows a delete link to appear, and if clicked it will remove the row/field:   
var ct = 1;
function new_bank(){
 ct++;
 var div1 = document.createElement('div');
 div1.id = ct;

 // bank to delete extended form elements

  var delLink = '<div style="text-align:right;margin-right:73px"><a 
  href="javascript:delIt('+ ct +')">Delete</a></div>';
  div1.innerHTML = document.getElementById('newbanktpl').innerHTML + delLink;
  document.getElementById('newbank').appendChild(div1);
}

function to delete the newly added set of elements
function delIt(eleId){
  d = document;
  var ele = d.getElementById(eleId);
  var parentEle = d.getElementById('newbank');
  parentEle.removeChild(ele);
}

The above code works correct. However as I have another Function which calculates the sum of the fields, and if I delete a row/field this sum doesn't update. 
I am looking for a reload function when delete link is clicked or something similar, then refresh the Total function and update the Total to the correct amount 
Below is my code for the total function: 
//Creating total
function findTotal(){
  var arr = document.getElementsByName('Value[]');
  var tot=0;
  for(var i=0;i<arr.length;i++){
   if(parseInt(arr[i].value))
   tot += parseInt(arr[i].value);}  
   document.getElementById('total').value = tot;
  }
}

A:

Inside your delIt() function call the  findTotal() function again like below:-
function delIt(eleId)
{
    d = document;
    var ele = d.getElementById(eleId);
    var parentEle = d.getElementById('newbank');
    parentEle.removeChild(ele);
    findTotal(); //call here
}

Now after removal it will recalculate the data and paste the new value to the total field.

