[jQuery] JQuery accordion and TBODY

[andy9989]

Hi everybody,

I am having problems with slideUP - slideDown applied to TBODY tag.
The initial state is hide - all. when I apply slideDown, it slides
down the content of TBODY (correctly) and instantly places it below
the table. Here is a simple code:


  $j(document).ready(function(){
    $j('tbody.cnt').hide();
    $j("#td1").click(function () {
      $j("#bd1").slideDown("slow");
          });
    $j("#td2").click(function () {
      $j("#bd1").slideUp("slow");
          });
  });

The table, which it applies to:

<table width="100%" border="0" cellspacing="0" cellpadding="0">
  <tr class="trigger">
    <td colspan="3" id="td1" >Toggle<strong></strong></td>
  </tr>
  <tbody id="bd1" class="cnt">
  <tr>
    <td>adfadfasdf</td>
    <td>adsfadsf</td>
    <td>asdfa</td>
  </tr>
  <tr>
    <td>asdf</td>
    <td>asdfadsf</td>
    <td>asdfdf</td>
  </tr>
  <tr>
    <td>adsfadsf</td>
    <td>adfdf</td>
    <td>aadfdf</td>
  </tr>
  </tbody>
  <tr class="trigger">
    <td colspan="3" id="td2" >Toggle<strong></strong></td>
  </tr>
  <tbody id="bd2" class="cnt">
  <tr>
    <td>adfadfasdf</td>
    <td>adsfadsf</td>
    <td>asdfa</td>
  </tr>
  <tr>
    <td>asdf</td>
    <td>asdfadsf</td>
    <td>asdfdf</td>
  </tr>
  <tr>
    <td>adsfadsf</td>
    <td>adfdf</td>
    <td>aadfdf</td>
  </tr>
  </tbody>
  <tr class="trigger">
    <td colspan="3" id="td3" >Toggle<strong></strong></td>
  </tr>
  <tbody id="bd3" class="cnt">
  <tr>
    <td>adfadfasdf</td>
    <td>adsfadsf</td>
    <td>asdfa</td>
  </tr>
  <tr>
    <td>asdf</td>
    <td>asdfadsf</td>
    <td>asdfdf</td>
  </tr>
  <tr>
    <td>adsfadsf</td>
    <td>adfdf</td>
    <td>aadfdf</td>
  </tr>
  </tbody>
  <tr class="trigger">
    <td colspan="3" id="td4" >Toggle<strong></strong></td>
  </tr>
  <tbody id="bd4" class="cnt">
  <tr>
    <td>adfadfasdf</td>
    <td>adsfadsf</td>
    <td>asdfa</td>
  </tr>
  <tr>
    <td>asdf</td>
    <td>asdfadsf</td>
    <td>asdfdf</td>
  </tr>
  <tr>
    <td>adsfadsf</td>
    <td>adfdf</td>
    <td>aadfdf</td>
  </tr>
  </tbody>
</table>

I cannot figure out what is wrong here.

Please, give me a clue

Thanks