add / rem row

[Emanuel]

Hallo Leute!

Ich will mittels JS bei einer Tabelle mehrere rows hinzufügen / entfernen. Soweit auch kein Problem:

  
<table id="testtable">  
  <tr>  
    <td>Topic1</td>  
    <td><input type="text" name=""></td>  
    <td><a href="javascript:addRow()"><img src="add.png"></a>  
        <a href="javascript:remRow()"><img src="delete.png"></a></td>  
  </tr>  
</table>  
<input type="submit" name="test1" value="fertig">  

Soviel zum HTML Teil, das JS sieht so aus:

  
function addRow()  
{  
  var row1 = document.createElement("TR")  
  var td1 = document.createElement("TD")  
  var td2 = document.createElement("TD")  
  var input = document.createElement("input")  
  var text = document.createTextNode("Topic1")  
  
  input.setAttribute("type","text");  
  ...  
  
  td1.appendChild(text)  
  td2.appendChild(input)  
  row1.appendChild(td1);  
  row1.appendChild(td2);  
  
  document.getElementById("testtable").appendChild(row1);  
}  
  
function remRow()  
{  
if(document.getElementById("testtable").getElementsByTagName("tr").length > 1){  
  var lasttr = document.getElementById("testtable").lastChild;  
  document.getElementById("testtable").removeChild(lasttr);  
  
    }  
}  

Damit kann man schön Felder hinzufügen und löschen. Das Problem ist, wenn man oft hintereinander hinzufügt und löscht, wird der Abstand zum Button nach der Tabelle immer größer.
Weiß einer wie man das Problem umgeht?

MfG Emanuel