Close multiple opened divs within <td> using jquery

I have a table with many columns, some of which have divs which are hidden by de开发者_运维问答fault. After clicking on that particular cell, I am making those divs appear by using jquery's fadeIn effect. Now I want a functionality, where, when I click on cell of some other row, I want all other opened divs to get closed except the ones on that row which I am clicking. I tried to check display property of opened divs but I am getting display property as undefined. Any suggestions how to go on about this ?

I think what you're after is this:

$(document).ready(function() {
    $("table tr td").click(function() {
        var clicked = $(this);
        var row = clicked.parent("tr");
        var table = row.parent("tbody").parent("table");
        table.find("td").not(row.find("td")).each(function() {
            $(this).find("div").fadeOut("slow");
        });
        clicked.find("div").fadeIn("slow");
    });
});

When clicking certain cell, it will fade out the <div> in all the cells that are not in the same row as the clicked cell.

Live test case.

$(".commonClassName").hide();

and after this show the div that you want to.

eg: http://jsfiddle.net/anilkamath87/Bs3Le/

Hope that helps