Question

today I have been asking here for help with this script.

It was successfully done – thanks again to RKW.

I’ve merge the code with my previous one, and everthing seems working well – under FF. But now, I’ve tryed it under Chrome, Safari (mac) and Opera.
In Chrome and Safari the script isn’t doing enything at all (and the error console stay clear). Under opera only the first part is working – the class active is added.

Any suggestions?

$(document).ready(function(){
    $('input').focus(function() { /* add class active to parent div */
        $('div').removeClass('active');
        $(this).parent().parent().parent().addClass('active');
        $(this).closest("div").addClass('active');
    });

    $('input:radio').focus(function() { /* add class highlight to specified tds in one column */
        var num = 2;
        var col = $(this).closest('td').index() + 1;
        var row = $(this).closest('tr').index();

        var tds = $('td:nth-child(' + col + ')');
        tds = tds.slice(row,row+num);

        $('td').removeClass('highlight');
        tds.addClass('highlight');
    });
});

Answer 1

I’m not too sure what you are trying to do with your highlight class (as in how/what it should highlight) however, there are a few changes you need to make to properly apply the classes to the divs.

Instead of using .focus(), you’ll want to use:

$('input').click(function()

and

$('input:radio').focus(function()

One note about input:radio is that it will have to use jQuery’s engine to find the radio buttons since it is not a standard CSS2/3 selector. If speed of execution is crucial, use Thiago Santos’ type=’radio’ (since CSS understands this, so will your browser).

The other thing I’ve changed is this:

$('div').removeClass('active');

Since it didn’t find the divs in chrome, however to do the same thing in a page when I was messing with transforms, I found all the elements that used the .active class and removed them from all elements before setting $(this) element with the tag. Changing it to:

$('.active').removeClass('active');

JSFiddle Example

I also noticed you were using CSS’ nth-child, please note that this does not work for IE8 or less (or IE9 in quirks mode).