JSFiddle - React, Tailwind, and code Playground
HTML
<body id="dt_example"><div id="container">
<table class="display" id="example" cellpadding="0" cellspacing="0" border="0">
<thead>
<ul>
<li> <a href="addedit.jsp">Add Code Edit</a></li>
<li> <a href="#">Import</a></li>
<li> <a href="#">Export</a></li>
</ul>
<tr>
<th>Id</th>
<th>Label</th>
<th>Cat</th>
<th>date</th>
<th>UpdatedAt</th>
<th></th>
<th></th>
<th></th>
</tr>
</thead>
<tbody>
<tr>
<td>test</td>
<td>test</td>
<td>test</td>
<td>test</td>
<td>test</td>
<td class="getimage">test</td>
<td class="editimage">test</td>
<td class="deleteimage">test</td>
</tr>
</tbody>
</table>
</div>
</body>
CSS
.getimage{
background-image: url('/images/copy.png');
background-repeat: no-repeat;
}
.editimage{
background-image: url('/images/edit.gif');
background-repeat: no-repeat;
}
.deleteimage{
background-image: url('/images/delete.gif');
background-repeat: no-repeat;
}
table,tr,td{border:1px solid red}
JavaScript
$(document).ready(function(){
//handle the click
$('td',this).click(function() {
$(this).css( "background-color", "red" );
});
});