JSFiddle - React, Tailwind, and code Playground
HTML
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<TABLE>
<THEAD>
<TR>
<TH>THING ONE</TH>
<TH>THING TWO</TH>
<TH>THING TRE</TH>
</TR>
</THEAD>
<TBODY>
<TR>
<TD>THING ONE</TD>
<TD>THING TWO</TD>
<TD>THING TRE</TD>
</TR>
<TR>
<TD>THING ONE</TD>
<TD>THING TWO</TD>
<TD>THING TRE</TD>
</TR>
</TBODY>
</TABLE>
<BUTTON>MAKE BS</BUTTON>
JavaScript
$("button").click(function(){
var table = $('table')[0];
makeBSTable(table);
$("button").remove();
});
/**
* Convert a regular table to bootstrap table
* @param table DOMElement
*/
function makeBSTable(otable){
var table = $(otable).clone(); console.log(table);
table.addClass("table-hover table-bordered table-striped table");
var div = $('<div class="table-responsive" />');
$(otable).replaceWith(div);
div.append(table);
}