JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="https://dl.dropbox.com/u/34573370/bootstrap/css/bootstrap.css">
<blockquote>Table 1</blockquote>
<table id="thetable" class="table table-bordered table-striped">
    <thead>
        <tr>
            <th scope="col">#</th>
            <th scope="col">Some Data 1</th>
            <th scope="col">Some Data 2</th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td scope="row">Week 1 </td>
            <td>33.95%</td>
            <td>40.68%</td>
        </tr>
        <tr>
            <td scope="row">Week 2 </td>
            <td>11.99%</td>
            <td>16.66%</td>
        </tr>
        <tr>
            <td scope="row">Week 3 </td>
            <td>1.96%</td>
            <td>0.93%</td>
        </tr>
        <tr>
            <td scope="row">Week 4 </td>
            <td>0.00%</td>
            <td>1.21%</td>
        </tr>
    </tbody>
</table>
<hr />
<blockquote>Table 2</blockquote>
<table class="table table-bordered table-striped">
    <thead>
        <tr>
            <th scope="col">#</th>
            <th scope="col">Week 1</th>
            <th scope="col">Week 2</th>
            <th scope="col">Week 3</th>
            <th scope="col">Week 4</th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td scope="row">Some Data 1 </td>
            <td>33.95%</td>
            <td>11.99%</td>
            <td>1.96%</td>
            <td>0.00%</td>
        </tr>
        <tr>
            <td scope="row">Some Data 1 </td>
            <td>40.68%</td>
            <td>16.66%</td>
            <td>0.93%</td>
            <td>1.21%</td>
        </tr>
    </tbody>
</table>

CSS

body { padding: 20px;}
.table { width: 350px;}

JavaScript

$(function() {
    var table = $('#thetable');
    table.find('thead tr').detach().prependTo( table.find('tbody') );
    var t = table.find('tbody').eq(0);
    var r = t.find('tr');
    var cols= r.length;
    var rows= r.eq(0).find('td,th').length;
    var cell, next, tem, i = 0;
    var tb= $('<tbody></tbody>');

    while(i<rows){
        cell= 0;
        tem= $('<tr></tr>');
        while(cell<cols){
            next= r.eq(cell++).find('td,th').eq(0);
            tem.append(next);
        }
        tb.append(tem);
        ++i;
    }
    table.find('tbody').remove();
    $(tb).appendTo(table);
    $(table)
        .find('tbody tr:eq(0)')
        .detach()
        .appendTo( table.find('thead') )
        .children()
        .each(function(){
            $(this).replaceWith('<th scope="col">'+$(this).html()+'</th>');
        });
    $(table)
        .find('tbody tr th:first-child')
        .each(function(){
            $(this).replaceWith('<td scope="row">'+$(this).html()+'</td>');
        });
    table.show();
})