JSFiddle - React, Tailwind, and code Playground
by jquery4u
HTML
<table id="colors">
<tbody>
<tr>
<th align="left" width="25%">Color Name</th>
<th align="left" width="15%">HEX</th>
<th align="left" width="43%">Color</th>
<th align="left" width="11%">Shades</th>
<th align="left">Mix</th>
</tr>
<tr>
<td align="left"><a target="_blank" href="/tags/ref_color_tryit.asp?color=AliceBlue">AliceBlue</a> </td>
<td align="left"><a target="_blank" href="/tags/ref_color_tryit.asp?hex=F0F8FF">#F0F8FF</a>
</td>
<td bgcolor="#F0F8FF"> </td>
<td align="left"><a href="/tags/ref_colorpicker.asp?colorhex=F0F8FF">Shades</a>
</td>
<td align="left"><a href="/tags/ref_colormixer.asp?colorbottom=F0F8FF&colortop=FFFFFF">Mix</a>
</td>
</tr>
<tr>
<td align="left"><a target="_blank" href="/tags/ref_color_tryit.asp?color=AntiqueWhite">AntiqueWhite</a> </td>
<td align="left"><a target="_blank" href="/tags/ref_color_tryit.asp?hex=FAEBD7">#FAEBD7</a>
</td>
<td bgcolor="#FAEBD7"> </td>
<td align="left"><a href="/tags/ref_colorpicker.asp?colorhex=FAEBD7">Shades</a>
</td>
<td align="left"><a href="/tags/ref_colormixer.asp?colorbottom=FAEBD7&colortop=FFFFFF">Mix</a>
</td>
</tr>
<tr>
<td align="left"><a target="_blank" href="/tags/ref_color_tryit.asp?color=Aqua">Aqua</a> </td>
<td align="left"><a target="_blank" href="/tags/ref_color_tryit.asp?hex=00FFFF">#00FFFF</a>
</td>
<td bgcolor="#00FFFF"> </td>
<td align="left"><a href="/tags/ref_colorpicker.asp?colorhex=00FFFF">Shades</a>
</td>
<td align="left"><a href="/tags/ref_colormixer.asp?colorbottom=00FFFF&colortop=FFFFFF">Mix</a>
</td>
</tr>
<tr>
...
JavaScript
//analyse each loop and usage of this
$(document).ready(function () {
$('*').click(function (e) {
e.preventDefault();
//console.log(this.attributes);
Array.prototype.slice.call(this.attributes).forEach(function (item) {
console.log(item.name + ': ' + item.value);
});
});
});