title: How to dynamically take table rows and create an Excel sheet
body: <p>I have the following script which takes the first row (<code>TH</code>) and adds it to a table dynamically which will then be exported to an Excel sheet. For some reason, it keeps adding and stacking on top of the next table row.</p>
  
  <p>Here is the script:</p>
  
  <pre><code>var decode_entities = (function () {
      // Remove HTML Entities
      var element = document.createElement('div');
  
      function decode_HTML_entities(str) {
  
          if (str &amp;&amp; typeof str === 'string') {
  
              // Escape HTML before decoding for HTML Entities
              str = escape(str).replace(/%26/g, '&amp;').replace(/%23/g, '#').replace(/%3B/g, ';');
  
              element.innerHTML = str;
              if (element.innerText) {
                  str = element.innerText;
                  element.innerText = '';
              } else {
                  // Firefox support
                  str = element.textContent;
                  element.textContent = '';
              }
          }
          return unescape(str);
      }
      return decode_HTML_entities;
  })();
  
  function fnExcelReport() {
      var tab_text = "&lt;table border='0'&gt;&lt;tr bgcolor='#FFFFFF' class='mainTR'&gt;";
      var textRange;
      var j, p = "", q = "";
      var tab = document.getElementById('BookingResults'); // id of table
  
  
      for (j = 0 ; j &lt; tab.rows.length ; j++) {
          for (var y = 0; y &lt; tab.rows[j].cells.length; y++) {
              if (y == tab.rows[j].cells.length - 1) {
                  if (j == 0) {
                      q = q + "&lt;TH scope=col class='headerLast vTop'&gt;";
                  }
                  else {
                      q = q + "&lt;TD class='bodyLast vTop'&gt;";
                  }
                  q = q + decode_entities(tab.rows[j].cells[y].innerHTML);
                  //alert("LAST COL INNER HTML: " + decode_entities(tab.rows[j].cells[y].innerHTML));
                  if (j == 0) {
                      q = q + "&lt;/TH&gt;";
                  }
                  else {
                      q = q + "&lt;/TD&gt;";
                  }
              }
              else {
                  if (j == 0) {
                      q = q + "&lt;TH scope=col class='headerNotLast vTop'&gt;";
                  }
                  else {
                      q = q + "&lt;TD class='bodyNotLast vTop'&gt;";
                  }
                  q = q + tab.rows[j].cells[y].innerHTML;
                  if (j == 0) {
                      q = q + "&lt;/TH&gt;";
                  }
                  else {
                      q = q + "&lt;/TD&gt;";
                  }
                  p = p + tab.rows[j].cells[y].innerHTML;
                  //alert("NOT LAST COL INNERHTML: " + p);
              }
          }
          //alert(q);
          //q = "";
          //alert(tab.rows[j].innerHTML);
          //tab_text = tab_text + tab.rows[j].innerHTML + "&lt;/tr&gt;&lt;tr bgcolor='#FFFFFF' class='mainTR'&gt;";
          tab_text = tab_text + q + "&lt;/tr&gt;&lt;tr bgcolor='#FFFFFF' class='mainTR'&gt;";
          alert(tab_text);
      }
  
      tab_text = tab_text + "&lt;/table&gt;";
      tab_text = tab_text.replace(/&lt;A[^&gt;]*&gt;|&lt;\/A&gt;/g, "");//remove if u want links in your table
      tab_text = tab_text.replace(/&lt;img[^&gt;]*&gt;/gi, ""); // remove if u want images in your table
      tab_text = tab_text.replace(/&lt;input[^&gt;]*&gt;|&lt;\/input&gt;/gi, ""); // reomves input params
  
      var ua = window.navigator.userAgent;
      var msie = ua.indexOf("MSIE ");
  
      if (msie &gt; 0 || !!navigator.userAgent.match(/Trident.*rv\:11\./))      // If Internet Explorer
      {
          txtArea1.document.open("txt/html", "replace");
          txtArea1.document.write(tab_text);
          txtArea1.document.close();
          txtArea1.focus();
          sa = txtArea1.document.execCommand("SaveAs", true, "SpecificGuidelines.xls");
      }
      else {                //other browser not tested on IE 11
          sa = window.open('data:application/vnd.ms-excel,' + encodeURIComponent(tab_text));
      }
  
      return (sa);
  }
  </code></pre>
  
  <p>Here is the first alert (shows the first row (<code>TH</code>)):</p>
  
  <p><img src="https://i.stack.imgur.com/0iHOi.png" alt="enter image description here"></p>
  
  <p>Here is the second alert (The red highlight is repeating, and I am sure on the third run, the first two will repeat and so forth...):</p>
  
  <p><img src="https://i.stack.imgur.com/gsXTt.png" alt="enter image description here"></p>
  
  <p>How do I make sure the <code>TH</code>/<code>TD</code> doesn't keep adding up and instead it goes to the next row and append.</p>
  
  <p>So I am looking to modify the script so it is:</p>
  
  <pre><code>&lt;table&gt;
      &lt;tr&gt;
          &lt;th&gt;&lt;/th&gt; //TH is the header so it appears only once in the table.
      &lt;/tr&gt;
      &lt;tr&gt;
          &lt;td&gt;&lt;/td&gt;
      &lt;/tr&gt;
      &lt;tr&gt;
          &lt;td&gt;&lt;/td&gt;
      &lt;/tr&gt;
      ...
  &lt;/table&gt;
  </code></pre>
  
  <p>What is happening right now:</p>
  
  <pre><code>&lt;table&gt;
      &lt;tr&gt;
          &lt;th&gt;&lt;/th&gt;
      &lt;/tr&gt;
      &lt;tr&gt;
          &lt;th&gt;&lt;/th&gt; //brought from the first entry
          &lt;td&gt;&lt;/td&gt;
      &lt;/tr&gt;
      &lt;tr&gt;
          &lt;th&gt;&lt;/th&gt; //brought from the first entry
          &lt;td&gt;&lt;/td&gt; //brought from the second entry
          &lt;td&gt;&lt;/td&gt;
      &lt;/tr&gt;
      ...
  &lt;/table&gt;
  </code></pre>