title: Add table row with JavaScript onclick
body: <p>I'm trying to add the exact same element found below using javascript. I've tried all the solutions found here, I even tried to echo the element with <code>php echo</code> but no luck. There is no need to change any input names, or anything like that, simply on click of that button, add another row to the table, and that's it. </p>
  
  <p>Here's the element:</p>
  
  <pre><code>&lt;tr&gt;
  &lt;td&gt;&lt;input type="text" name="links"&gt;&lt;/td&gt;
  &lt;td&gt;&lt;input type="text" name="keywords"&gt;&lt;/td&gt; 
  &lt;td&gt;&lt;input type="text" name="violationtype"&gt;&lt;/td&gt;   
  &lt;td&gt;&lt;input type="submit" id="last" class="button" value="Add another line" onclick:"addField();"&gt;&lt;/td&gt;          
  &lt;/tr&gt;
  </code></pre>
  
  <p>I'm up for anything really, however, I'd like javascript as I kept my system without any external reference (such as jquery) but at this point I'm open to any suggestions. I tried doing it with the following code:</p>
  
  <pre><code>function addFields() {
      var number = document.getElementById("last").value;
      var html = '&lt;tr&gt;' +
      '&lt;td&gt;&lt;input type="text" name="links"&gt;&lt;/td&gt;' +
      '&lt;td&gt;&lt;input type="text" name="keywords"&gt;&lt;/td&gt;' +
      '&lt;td&gt;&lt;input type="text" name="violationtype"&gt;&lt;/td&gt;' +
      '&lt;td&gt;&lt;input type="submit" id="last" class="button" value="Add another line" name="line" onclick:"addField();"&gt;&lt;/td&gt;';
      number.appendChild(html);
  }
  </code></pre>
  
  <p>But it doesn't seem to do anything. I assume I should handle the code knowing which input is last in a better way than <code>id="last"</code> but I have no clue how to do it. </p>