title: Javascript Add Table Row
body: <p>I'm not sure how to add a row where I want it.</p>
  
  <pre><code>&lt;script language="javascript"&gt;
  var i = 1;
  function changeIt()
  {
      i++;
      my_div.innerHTML = my_div.innerHTML +"&lt;tr&gt;&lt;td valign='middle'&gt;&lt;strong&gt;URL "+ i+":&lt;/strong&gt;&lt;/td&gt;&lt;td&gt;&lt;input name='url'+ i type='text' size='40' /&gt;&lt;/td&gt;&lt;/tr&gt;"
  }
  &lt;/script&gt;
  
  &lt;form method="post" action="&lt;?php echo $_SERVER["REQUEST_URI"]; ?&gt;"&gt;
      &lt;table width="300px"&gt;
          &lt;tr&gt;
              &lt;td valign="middle"&gt;&lt;strong&gt;Name:&lt;/strong&gt;&lt;/td&gt;
              &lt;td&gt;&lt;input name="name" type="text" size="40" /&gt;&lt;/td&gt;
          &lt;/tr&gt;
          &lt;tr&gt;
              &lt;td valign="middle"&gt;&lt;strong&gt;Password:&lt;/strong&gt;&lt;/td&gt;
              &lt;td&gt;&lt;input name="password" type="text" size="40" /&gt;&lt;/td&gt;
          &lt;/tr&gt;
          &lt;tr&gt;
              &lt;td valign="middle"&gt;&lt;strong&gt;URL:&lt;/strong&gt;&lt;/td&gt;
              &lt;td&gt;&lt;input name="url" type="text" size="40" /&gt;&lt;a href="" onClick="changeIt();return false;"&gt;+&lt;/a&gt;&lt;/td&gt;
          &lt;/tr&gt;
          &lt;tr id="my_div"&gt;&lt;/tr&gt;
          &lt;tr&gt;
              &lt;td valign="middle"&gt;&lt;strong&gt;ETC:&lt;/strong&gt;&lt;/td&gt;
              &lt;td&gt;&lt;input name="etc" type="text" size="40" /&gt;&lt;/td&gt;
          &lt;/tr&gt;
  </code></pre>
  
  <p><br>
                    
              
          
      </p>
  
  <p>The following is where I want the rows to appear:</p>
  
  <pre><code>&lt;tr id="my_div"&gt;&lt;/tr&gt; 
  </code></pre>
  
  <p>Currently that produces new rows within a row. I don't want that. I only want a new row not in a row.</p>
  
  <p>When I click the + I want it to produce:</p>
  
  <pre><code>    &lt;tr&gt;
          &lt;td valign="middle"&gt;&lt;strong&gt;URL 2:&lt;/strong&gt;&lt;/td&gt;
           &lt;td&gt;&lt;input name="url2" type="text" size="40" /&gt;&lt;/td&gt;
      &lt;/tr&gt;
  </code></pre>
  
  <p>I don't want that within:</p>
  
  <pre><code>&lt;tr id="my_div"&gt;&lt;/tr&gt;
  </code></pre>
  
  <p>I just have that there because I don't know what to do.</p>