title: Export to Excel from HTML table Jquery is not Exporting Headers of the Table
body: <p>I want to Export a HTML Table which is dynamically generated based on the data.
  This is the table layout before the data is populated.
  Once the data is queried, i'm populating the rows to the table dyanimcally.</p>
  
  <pre><code>&lt;table id="findCntrctTable"&gt;
      &lt;thead&gt;
          &lt;tr&gt;
              &lt;th&gt;
                  Contract &lt;br /&gt;
                  Number
              &lt;/th&gt;
              &lt;th&gt;
                  Requestor&lt;br /&gt;
                  Name
              &lt;/th&gt;
              &lt;th&gt;
                  Requesting&lt;br /&gt;
                  Office/District
              &lt;/th&gt;
              &lt;th&gt;
                  Requested&lt;br /&gt;
                  Date
              &lt;/th&gt;
              &lt;th&gt;
                  Contract&lt;br /&gt;
                  Status
              &lt;/th&gt;
              &lt;th&gt;
                  Estimated &lt;br /&gt;
                  Contract Cost
              &lt;/th&gt;
              &lt;th&gt;
                  Contract &lt;br /&gt;
                  Type
              &lt;/th&gt;
              &lt;th&gt;
                  Receivable/
                  &lt;br /&gt;Payable
              &lt;/th&gt;
              &lt;th&gt;
                  Contractors
                  &lt;br /&gt;
              &lt;/th&gt;
              &lt;th&gt;
                  SP Numbers
                  &lt;br /&gt;
              &lt;/th&gt;    
          &lt;/tr&gt;
      &lt;/thead&gt;
      &lt;tbody&gt;
      &lt;tr&gt;&lt;/tr&gt;
      &lt;/tbody&gt;
  &lt;/table&gt;  
  </code></pre>
  
  <p>I have link to export the table to Excel </p>
  
  <pre><code>&lt;a href="#" style="cursor: pointer; font-weight:bold; font-style:italic; float:right " onclick=ExportToExcel()&gt;Export to Excel&lt;/a&gt;
  </code></pre>
  
  <p>here's the jquery Function i wrote </p>
  
  <pre><code>function ExportToExcel() {
      debugger;
      var a = document.createElement('a');
      var data_type = 'data:application/vnd.ms-excel';
      var table = $('#findCntrctTable');
      //var Header = table.find('th');
      var table_html = table[0].outerHTML.replace(/ /g, '%20');
      a.href = data_type + ', ' + table_html;
      a.download = 'SearchResults.xls';
      a.click();
      //window.open('data:application/vnd.ms-excel,' + encodeURIComponent(table[0].outerHTML));
   }
  </code></pre>
  
  <p>This is how my table is being populated once i get the data</p>
  
  <pre><code>    function writetable(data) {         
          var tableOutline = '';          
          for (var i = 0; i &lt; data.length; i++) {
              var id = 'row' + data[i].ContractNumber;
          tableOutline = tableOutline + '&lt;tr id="row_' + data[i].ContractNumber + '" onclick="getCntrctNbr(this,' + data[i].ContractNumber + ')"&gt;&lt;td style="text-align:left" &gt;&lt;a&gt;';
          tableOutline = tableOutline + data[i].ContractNumber + '&lt;/a&gt;&lt;/td&gt;&lt;td&gt;' + data[i].RequestorName + '&lt;/td&gt;&lt;td&gt;' + data[i].RequestingOffDisct + '&lt;/td&gt;&lt;td style="text-align:right"&gt;' + formatJSONDate(data[i].RequestedDate) + '&lt;/td&gt;&lt;td&gt;' + data[i].ContractStatus + '&lt;/td&gt;&lt;td style="text-align:right"&gt;' + formatCurrency(data[i].EstimateContractCost) + '&lt;/td&gt;&lt;td&gt;' + data[i].ContractType + '&lt;/td&gt;&lt;td&gt;' + data[i].PayReceivable + '&lt;/td&gt;&lt;td&gt;' + data[i].ControrList + '&lt;/td&gt;&lt;td&gt;' + data[i].SPList + '&lt;/td&gt;&lt;/tr&gt;';
          }
              tableOutline = tableOutline;
              $('#findCntrctTable').append(tableOutline);
              $('#findCntrctTable').show();
  
          }      
  </code></pre>
  
  <p>When export to excel the header fields are not showing up in the spreadsheet.
  Can You please Help me with this issue.
  Thanks in advance</p>