title: javascript: .innerHTML in to table not adding new rows
body: <p>My js is not adding rows to the end of my table<br/>
  HTML:<br/></p>
  
  <pre><code>&lt;table border="1" style="border-collapse: collapse;" width="100%" id="tbLIFE"&gt;
      &lt;tr&gt;&lt;th colspan="3"&gt;LifePath&lt;/th&gt;&lt;/tr&gt;
      &lt;tr&gt;&lt;th colspan="3"&gt;Style&lt;/th&gt;&lt;/tr&gt;
      &lt;tr id="LifeEvents"&gt;&lt;/tr&gt;
  &lt;/table&gt;
  </code></pre>
  
  <p>js:</p>
  
  <pre><code>//LIFE EVENTS
  var d61 = Math.floor(Math.random()*6)+1;
  var d62 = Math.floor(Math.random()*6)+1;
  var Age = d61+d62+16;
  
  document.getElementById("LifeEvents").innerHTML = "&lt;th colspan=3 id='lifeEvents'&gt;Life Events&lt;/th&gt;";
  document.getElementById("LifeEvents").innerHTML += "&lt;/tr&gt;&lt;tr&gt;&lt;td&gt;Age&lt;/td&gt;&lt;td&gt;"+Age+"&lt;/td&gt;";
  </code></pre>
  
  <p>i dont mind useing jquery.</p>