JSFiddle - React, Tailwind, and code Playground
HTML
<table id="table">
<tbody>
<tr>
<td>Currency</td>
<td>*GBP</td>
</tr>
<tr>
<td>Quantity</td>
<td>1-9</td>
<td>10-49</td>
<td>50-99</td>
<td>100-249</td>
<td>250+</td>
</tr>
<tr>
<td>Price</td>
<td>£ 400.10</td>
<td>£ 284.20</td>
<td>£ 256.10</td>
<td>£ 244.20</td>
<td>£ 224.00</td>
</tr>
</tbody>
</table>
JavaScript
var intervals;
var target = $('#table');
var qty = target.find('td:contains(Price)');
var row = qty.closest('tr');
arr = new Array();
row.find('td').each( function() {
if ($(this).text() !== "Price" ) {
intervals = new Array();
addAnimation($(this));
}
});
function addAnimation(cell) {
var intv = setInterval(function() {
cell.fadeTo("slow", 0.3);
cell.fadeTo("slow", 1);
}, 1000);
intervals.push(intv);
cell.click(function() {
for (var i = 0; i < intervals.length; intervals++) {
window.clearInterval(intervals[i]);
}
});
}