JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="https://rawgit.com/wenzhixin/bootstrap-table/master/src/bootstrap-table.css">
<script src="https://rawgit.com/wenzhixin/bootstrap-table/master/src/bootstrap-table.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/js/bootstrap.min.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap-theme.min.css">
<div id="toolbar">
    <button id="compareBtn" class="btn btn-warning">Compare</button>
    <button id="allBtn" class="btn btn-success">All</button>
    <button id="luxuryBtn" class="btn btn-info">Luxury</button>
    <button id="sedanBtn" class="btn btn-info">Sedan</button>
    <!--<button id="smallBtn" class="btn btn-default">Small</button>
    <button id="mediumBtn" class="btn btn-default">Medium</button>-->

</div>
<div class="table-responsive">
<table id="table" 
       data-toolbar="#toolbar"
       data-search="true"
       data-show-toggle="true"
       data-show-columns="true"
       data-sort-name="1"
       data-sort-order="desc"
       data-click-to-select="true"
       data-classes="table table-no-bordered"
       data-maintain-selected="true"
       >
    <thead>
    <tr>
        <th data-field="state" data-checkbox="true" data-align="center" data-valign="middle"></th>
        <th data-field="0" data-sortable="true" data-align="left" data-valign="middle">Car Model</th>
        <th data-field="1" data-sortable="true"data-align="center"data-valign="middle" data-toggle="tooltip" data-placement="bottom" title="This is an awesome score!">Leasehackr Score</th>
        <th data-field="11" data-sortable="true"data-align="center" data-valign="middle">Type</th>
        <th data-field="12" data-sortable="true"data-align="center" data-valign="middle">Size</th>
        <th data-field="2" data-sortable="true"data-align="center" data-valign="middle">Monthly Cost</th>
        <th data-field="3" data-sortable="true"data-align="center" data-valign="middle">Retail...

CSS

.btn-info{
    border-radius: 20px;
    border-color: #31b0d5; 
    background-color: transparent;
    color: white;
   
}

th{
    background: #46b8da;
    color: white;
}

.fixed-table-header {
    border-bottom: 1px solid red;
}

.testclass{
    border-bottom: dotted;
    color: blue;
}

JavaScript

var global_data;

$.getJSON("https://www.googleapis.com/fusiontables/v2/query?sql=SELECT%20*%20FROM%201Nzsjv6Fg4Jm1YzEa9mgUwHPRB8Fkpuurvlv9b8-v&key=AIzaSyARDzql1SCv34S7Vt9bNvxS_k3-pvZCzvw", function(obj) {
    //data = obj.columns
    data = []; // Empty list
    for (var i = 0; i < obj.rows.length; i++) {
        row = obj.rows[i];
        data[i] = {}; // Empty dictionary object
        for (var j = 0; j < row.length; j++) {
            data[i][j.toString()] = row[j]; // Create a key and value pair.
        }
    }
    global_data = data;
    /*
    for (var p=0; p<global_data.length; p++){
        global_data[p].7 = global_data[p].7.toFixed(1);
    }
    */
    $(function () {
        $('#table').bootstrapTable({
            data: global_data,
        });
    });
    
    $(function () {
        $('[data-toggle="tooltip"]').tooltip()
    });

});


//all button:
var $allBtn = $('#allBtn');
$(function () {
    $allBtn.click(function () {
        
        // reload all original data to ignore selections
        $table.bootstrapTable('load',{
            data: global_data,
        });
        
        // Turn off filters
         $table.bootstrapTable('filterBy',false);
    });
}); 


//getData button:
     var $table = $('#table'),
        $button = $('#button');
    $(function () {
        $button.click(function () {
            alert(JSON.stringify($table.bootstrapTable('getData')));
        });
    });

 

//compare button:
var $table = $('#table'),
    $compareBtn = $('#compareBtn');

$(function () {
    $compareBtn.click(function () {
        $table.bootstrapTable('load',{
            data:$table.bootstrapTable('getSelections'),
        });
        $table.bootstrapTable('filterBy',false);
        
        $(function () {
            $('[data-toggle="tooltip"]').tooltip()
        });   
        
    });
});     

var...