JSFiddle - React, Tailwind, and code Playground
HTML
TABLE 1
<table id ="table1">
<tr bgcolor="#f0f0f0">
<td nowrap="" ><b>COLUMN_NAME</b></td>
<td nowrap=""><b>DATA_TYPE</b></td>
<td nowrap=""><b>IS_NULLABLE</b></td>
<td nowrap=""><b>CHARACTER_MAXIMUM_LENGTH</b></td>
<td nowrap=""><b>NUMERIC_PRECISION</b></td>
<td nowrap=""><b>COLUMN_KEY</b></td>
</tr>
<tr>
<td class="colNameivr">CountryCODE </td>
<td nowrap="">int </td>
<td nowrap="">YES </td>
<td nowrap="">NULL </td>
<td nowrap="">10 </td>
<td ></td>
</tr>
<tr>
<td class="colNameivr">Number </td>
<td nowrap="">varchar </td>
<td nowrap="">NO </td>
<td nowrap="">22 </td>
<td nowrap="">NULL </td>
<td >PRI </td>
</tr><tr>
<td class="colNameivr">Type </td>
<td nowrap="">tinyint </td>
<td nowrap="">NO </td>
<td nowrap="">NULL </td>
<td nowrap="">3 </td>
<td >PRI </td>
</tr>
<tr>
<td class="colNameivr">Date </td>
<td nowrap="">smalldatetime </td>
<td nowrap="">NO </td>
<td nowrap="">NULL </td>
<td >NULL </td>
<td ></td>
</tr>
</table>
<br>
<br>
TABLE 2
<table id ="table2">
<tr bgcolor="#f0f0f0">
<td ><b>COLUMN_NAME</b></td>
<td nowrap=""><b>DATA_TYPE</b></td>
<td nowrap=""><b>IS_NULLABLE</b></td>
<td nowrap=""><b>CHARACTER_MAXIMUM_LENGTH</b></td>
<td nowrap=""><b>NUMERIC_PRECISION</b></td>
<td ><b>COLUMN_KEY</b></td>
</tr>
<tr>
<td class="colNametns">CountryCode</td>
<td nowrap="">int</td>
<td nowrap="">NO</td>
<td nowrap="">NULL</td>
<td nowrap="">10</td>
<td ></td>
</tr>
<tr>
<td class="colNametns">PhoneNumber</td>
<td nowrap="">varchar</td>
<td nowrap="">NO</td>
<td nowrap="">20</td>
<td...
CSS
.red
{
background-color:Green;
}
JavaScript
jQuery.noConflict();
var counter;
function callme() {
jQuery('.colNametns').each(function(i) {
var itemName = jQuery(this).text();
var match = jQuery('.colNameivr:contains("' + itemName + '")');
if(!match.length){
jQuery(this).toggleClass('red');
counter = i;
}
if(match.length){
// alert(i+"--"+itemName );
//callme1(itemName);
}
});
}