JSFiddle - React, Tailwind, and code Playground

by beej

HTML

<table id="consolidated">
    <thead>
    <td>ArmstID</td><td>Action Date</td><td>Description</td><td>Billed</td><td>Open Balance</td></thead>
    <tbody>
    <tr><td>321338</td><td>2011-03-29 00:00:00.000</td><td>Convert 2010 to Certificate of Sale</td><td>-1098.0100</td><td>.0000</td></tr><tr><td>321653</td><td>2011-03-29 00:00:00.000</td><td>2010 Cert. of Sale- 013-050-025</td><td>193.0100</td><td>193.0100</td></tr><tr><td>321654</td><td>2011-03-29 00:00:00.000</td><td>2010 Cert. of Sale- 013-050-029</td><td>115.3700</td><td>115.3700</td></tr><tr><td>321655</td><td>2011-03-29 00:00:00.000</td><td>2010 Cert. of Sale- 013-050-032</td><td>300.7200</td><td>300.7200</td></tr><tr><td>321656</td><td>2011-03-29 00:00:00.000</td><td>2010 Cert. of Sale- 013-050-038</td><td>265.2200</td><td>265.2200</td></tr><tr><td>321657</td><td>2011-03-29 00:00:00.000</td><td>2010 Cert. of Sale- 013-050-060</td><td>223.6900</td><td>223.6900</td></tr>
    </tbody>
</table>

CSS

td { 
    border: 1px solid #ccc;
    padding: 2px;
}

JavaScript

$("tr").click(function() {
    var id = $(this).find("td:first-child").text();
    $("<tr><td colspan='5'>Hey there!</tr></tr>").insertAfter(this);
});