Hey everyone. I just love playing with jquery. What was I thinking to avoid it for past two years :D

One problem though.

I have large table like div as shown below:
<div class="table_row">
        blah blah
</div>
<div id="table_row_extended1" style="display: none">
</div>
....

and loop of it for data from mysql. When I click any row it expands additional info about that row. Problem is  say I have one row expanded and click another one. I need previous one to collapse. Since there are at least 100 of table_row_extended1 in a file I don't know how to keep track of them.

Tried (where test is my div name ex.: "table_row_extended1"):
    if($(test).hasClass("collapsed")) {
        $(test).addClass("expanded").slideDown();
    }
    else{
        $(test).addClass('collapsed').slideUp();
    }

But I it looks like addClass or hasClass works badly. Depending on "if" structure it either expands and not collapses, or expands and collapses, but only once per element without reloading page.