Javascript-форум - У меня nextSibling работает с вложенными div и не работает с вложенными таблицами

При добавлении поля в многоуровневом диве скрипт работает правильно, добавляя поле после нажатой кнопки; а со вложенной таблицей добавляет только в конец, вне зависимости от того, какая кнопка нажата.В чём дело?
Страница с дивами:

<html>
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">    
    <script type="text/javascript">
    var count = 0;
    function add_input(obj,parDiv)
{
  count = count + 1;
  var new_input=document.createElement('div');
  new_input.innerHTML='<div><div><div><input value="поле #'+count+'"><input type="button" value="+" onclick="add_input(this.parentNode.parentNode.parentNode.parentNode,''+parDiv+'')"><input type="button" value="-" onclick="del_input(this.parentNode.parentNode.parentNode.parentNode,''+parDiv+'')"></div></div></div>';
  if (obj.nextSibling)
    document.getElementById(parDiv).insertBefore(new_input,obj.nextSibling)
  else document.getElementById(parDiv).appendChild(new_input); 
}
function del_input(obj,parDiv)
{
  document.getElementById(parDiv).removeChild(obj)
}
    
    </script>    
    <title>
    </title>
  </head>
  <body>
    div 4-го уровня
    <div id="content">
      <div>
        <div>
          <div>
            <div>
            <input name="date" class="date_input" size="20">
            <input type="button" value="+" onclick="add_input(this.parentNode.parentNode.parentNode.parentNode,'content')">
            </div>
          </div>
        </div>
      </div>
    </div>
  </body>
</html>

Страница с таблицей:

<html>
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">    
    <script type="text/javascript">
    var count = 0;
    function add_input(obj,parDiv)
{
  count = count + 1;
  var new_input=document.createElement('div');
  new_input.innerHTML='<table><tr><td><input value="поле #'+count+'"></td><td><input type="button" value="+" onclick="add_input(this.parentNode.parentNode.parentNode,''+parDiv+'')"><input type="button" value="-" onclick="del_input(this.parentNode.parentNode.parentNode.parentNode.parentNode,''+parDiv+'')"></td></tr></table>';
  if (obj.nextSibling)
    document.getElementById(parDiv).insertBefore(new_input,obj.nextSibling)
  else document.getElementById(parDiv).appendChild(new_input); 
}
function del_input(obj,parDiv)
{
  document.getElementById(parDiv).removeChild(obj)
}
    
    </script>    
    <title>
    </title>
  </head>
  <body>
    динамические таблицы
    <div id="content">
      <div>
        <table>
          <tr>
            <td>
            <input name="date" class="date_input" size="20">
            <input type="button" value="+" onclick="add_input(this.parentNode.parentNode.parentNode,'content')">
            </td>
          </tr>
        </table>
      </div>
    </div>
  </body>
</html>

PS. для проверки в ' '+parDiv+' ' нужно заменить внешние кавычки на [амперсанд]#39;