Динамическое добавление строки

by Vladislav Altyncev

HTML

<link rel="stylesheet" href="http://shadow.perm.ru/test/pr/bootstrap.min.css">
<div id="ListTrFn">
  <div class="row-fluid">
    <div class="span3">label1</div>
    <div class="span9 input-append">
      <input class="span10" type="text" name="name[1]" value="">
      <button onclick="return deleteField(this)" class="btn" type="button">-</button>
      <button onclick="return addField(this)" class="btn" type="button">+</button>
    </div>
  </div>
  <div class="row-fluid">
    <div class="span3">label2</div>
    <div class="span9">
      <div class="span12 input-append">
        <input class="span10" type="text" name="" value="" placeholder="">
        <button onclick="return deleteField(this)" class="btn" type="button">-</button>
        <button onclick="return addField(this)" class="btn" type="button">+</button>
      </div>
    </div>
  </div>
</div><!-- end #ListTrFn -->
      
<script>
    function insertAfter(elem, refElem) {
    while (refElem.nodeType!=1) refElem = refElem.nextSibling;
    return refElem.parentNode.insertBefore(elem, refElem.nextSibling);
  }
var countOfFields = 1;
var curFieldNameId = 1;
var maxFieldLimit = 25;
function deleteField(a) {
    var contDiv = a.parentNode.parentNode
    contDiv.parentNode.removeChild(contDiv)
    countOfFields--
    return false
}
function addField(el) {
if (countOfFields >= maxFieldLimit) {
alert("Число полей достигло своего максимума = " + maxFieldLimit);
return false;
}
countOfFields++;
curFieldNameId++;
var div = document.createElement("div");
div.setAttribute("class", "row-fluid");
div.innerHTML = "<div class=\"span9 offset3 input-append\"><input class=\"span10\" type=\"text\" name=\"name[1]\" value=\"\" placeholder=\"\"><button onclick=\"return deleteField(this)\" class=\"btn\" type=\"button\">-</button><button onclick=\"return addField(this)\" class=\"btn\" type=\"button\">+</button></div>";
    //document.getElementById("ListTrFn").appendChild(div);
   ...