JSFiddle - React, Tailwind, and code Playground

by cillay

HTML

<div id="toolbar">
    <button>Selected Customer ID</button>
</div>

<table id="tblCustomers" xmlns:foo="urn:foo/Customers">
  <thead>
    <tr><th>Customer</th><th>Balance</th></tr>
  </thead>
  <tbody>
    <tr><td foo:CustomerID="1">Smith</td><td>$10.00</td></tr>
    <tr><td foo:CustomerID="2">Jones</td><td>$20.00</td></tr>
  </tbody>
</table>

CSS

* {
  font: normal 13px 'Segoe UI', Verdana, Arial, sans-serif;
}

#tblCustomers, #toolbar {
  width: 300px;
}

table th, #toolbar {
  background-color: WhiteSmoke;
  font-weight: bold;
}

#toolbar {
  border: 1px solid #c0c0c0;
}

JavaScript

$(document).ready(function() {
    $('#tblCustomers').find('tr').click(function() {
        
    });
});