In 2016 I wrote a Javascript function for a web application (flyatlas2.org) that does the following:

If you click in a cell in Table 1, it highlights the appropriate column in Table 2.

This is illustrated by the the left screenshot below, which is an example the user can view and check here.

It was taken under Mac OS X Mojave with the Safari (v.14.1.2) web browser, although Chrome (103) behaves the same way, as does Edge on Windows 10 (Education 21H2 64 bit running in emulation).

However, under Mac OS X Mojave with Firefox (v.101), all these browsers on Mac OS X Monterey, and Chrome (v.103) or Firefox on Windows 10 , the column highlighted in the lower table is that headed Ag (Accessory glands), not Cs (Carcass), as shown on the right. (I was alerted to the problem by someone running Windows on a PC rather than in emulation on a Mac.)

So something must have changed in the browser interpretation of Javascript. But what?

My code is below (the top table is geneTable, the bottom one transTable):

function hiliteTrans(geneCellID, geneTableID)
{  
    clearBordersT();  // removes borders from any previous selection
    // IDs follow underscore
    var transTableID = "tabTrans" + geneTableID.substring(geneTableID.indexOf("_"));
    geneCellID = geneCellID.substring(geneCellID.indexOf("_") + 1);
    var transTable = document.getElementById(transTableID); 
    for (var i=1; i<transTable.rows.length; i++) // modified for two name rows
    {
        for (var j=2; j < transTable.rows[i].cells.length; j++)
        {
            if(j-1==geneCellID) // modified for two name cells
            {
                if(i==1)
                {
                    transTable.rows[i].cells[j].classList.add("highlightT");
                }
                else
                {
                    transTable.rows[i].cells[j].classList.add("outlineT");
                }
            }
        }
    }  
}