JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="https://dl.dropboxusercontent.com/u/7760475/reports.css">
<link rel="stylesheet" href="https://dl.dropboxusercontent.com/u/7760475/bootstrap.css">
<div id="report">
  <!-- Default panel contents -->
  <div class="panel-heading">Table</div>

  <!-- Table -->
  <table class="table table-condensed">
    <tr class="header-row row-border thick">
      <th>ID</th>
      <th>Name</th>
    </tr>
    <tr>
      <td>One</td>
      <td>Description.</td>
    </tr>
    <tr class="data-row thick-underlined">
      <td>Two</td>
      <td>Another description</td>
    </tr>
  </table>
</div>
<a id='print' href="#">Print</a>

JavaScript

var windowInstance;
$(function(){
    $('body').append('<iframe id="print_frame" name="print_frame" width="0" height="0" frameborder="0" src="about:blank"></iframe>');
    $("link").clone().appendTo($("#print_frame").contents().find("head"));
	windowInstance = window.frames["print_frame"].window;
 
});


$('#print').click(function () {
	var divId = 'report';
    var printDivCSSpre ='<div id="printReportDiv" style="width:1000px; padding-right:20px;">';
    var printDivCSSpost = '</div>';

	window.frames["print_frame"].document.body.innerHTML = printDivCSSpre + document.getElementById(divId).innerHTML + printDivCSSpost;
	window.frames["print_frame"].window.focus();
	windowInstance.print();
});