title: Remove nodes from a form?
body: <p>I am trying to remove (almost) all nodes from a form. I managed to remove all nodes from the form using the following code:</p>
  
  <pre><code>var form;
  form = document.getElementById(id);
  while (form.hasChildNodes())
      form.removeChild(form.lastChild);
  </code></pre>
  
  <p>However, that will not suffice because I will be adding some logic to keep certain nodes. Therefore, I need to remove the nodes using a <code>for loop</code>. I tried with the following code:</p>
  
  <pre><code>var form, formNodes, totalNodes, i;
  form = document.getElementById(id);
  formNodes = form.childNodes;
  totalNodes = formNodes.length;
  for (i = 0; i &lt; totalNodes; i++)
      form.removeChild(formNodes[i]);
  </code></pre>
  
  <p>Some nodes are removed, but I received this error:</p>
  
  <blockquote>
    <p>Uncaught TypeError: Failed to execute 'removeChild' on 'Node': parameter 1 is not of type 'Node'</p>
  </blockquote>
  
  <p>Considering <code>formNodes</code> only contains nodes, what could be causing the error? </p>
  
  <h2>Edit</h2>
  
  <p>I tried looping backwards using the following code:</p>
  
  <pre><code>var form, formNodes, totalNodes, i;
  form = document.getElementById(id);
  formNodes = form.childNodes;
  totalNodes = formNodes.length;
  for (i = totalNodes - 1; i &gt;= 0; i--)
      form.removeChild(formNodes[i]);
  </code></pre>
  
  <p>And it removes all nodes. I'll subtract an offset variable from <code>i</code> so that I am able to keep certain nodes.</p>
  
  <h2>Edit</h2>
  
  <p>My question is different because I am trying to remove nodes from a form, not using <code>getElementsByTagName</code> to get paragraph elements. A <code>node</code> is not the same as an <code>element</code>. The solution to my question may be similar but the question is not the same.</p>