JSFiddle - React, Tailwind, and code Playground
HTML
<table style="border: red 1px solid; width:300px;">
<tr class="surbooking">
<td id="first" class="click">foo</td>
<td id="second" class="click">foo</td>
<td>foo</td>
<td>foo</td>
<td>foo</td>
</tr>
</table>
CSS
.surbooking {
background-color: #FFF6BF !important;
border-top: 2px solid #FFD324;
border-bottom: 2px solid #FFD324;
}
.surbooking:after {
content: "Surbooking";
position: absolute;
left: 1em;
z-index: 0;
font-size: 1em;
opacity: .25;
font-style: italic;
}
table {
font-size: .85em;
font-family: "Segoe UI", Verdana, Helvetica, Sans-Serif;
color: #232323;
background-color: #fff;
}
JavaScript
$(".click").click(function() { alert(this.id) })