JSFiddle - React, Tailwind, and code Playground
HTML
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.5.2/jquery.min.js"></script>
<table>
<thead>
<tr>
<th><div id="columnOne"><span>heading one</span></div></th>
<th><div id="columnTwo"><span>heading two</span></div></th>
</tr>
</thead>
<tbody>
<tr>
<td>1</td>
<td>2</td>
</tr>
<tr>
<td>4</td>
<td>5</td>
</tr>
</tbody>
</table>
JavaScript
$(document).ready(function(){
var font = {font: '12px Helvetica, Arial'};
var fill = {fill: "hsb(120deg, .5, 1)"}
$('tr th div').each(function (index, div){
R = Raphael($(div).attr('id'), 20, 100);
R.text(4, 50, $(div).find('span').text())
.attr(font)
.attr(fill)
.rotate(-90, true);
$(div).find('span').hide();
});
});