O que há de errado com esta função jQuery, ajuda

Question

$(function() {
    $("table.section thead").click(function() {
      if ($(this).next("table.section tbody").style.display == "block"){
         $(this).next("table.section tbody").slideUp("slow");
      }
      if ($(this).next("table.section tbody").style.display == "none"){
         $(this).next("table.section tbody").slideDown("slow");
      }
    });
});

Não sei como conseguir isso, qualquer ajuda seria muito apreciada.

ATUALIZAR:

Eu estava tentando usar a seguinte função.

$(function() {
    $("table.section thead").click(function() {
    $(this).next("table.section tbody").slideToggle("slow");

    });
});

O que me dá um problema (quando ele entra em colapso e você clica nele, ele se expande e depois entra em colapso novamente, para que sempre fosse colapso). É por isso que estou tentando obter a função no topo.

Answer 1

Use o seletor visível neste caso:

$(function() {
    $("table.section thead").click(function() {
      var body = $(this).next("table.section tbody");
      if (body.is(":visible"))
         body.slideUp("slow");
      else
         body.slideDown("slow");
    });
});

Mas provavelmente muito mais simples, apenas use .slideToggle() assim:

$(function() {
    $("table.section thead").click(function() {
      $(this).next("table.section tbody").slideToggle("slow");
    });
});