accordion in a table form....

accordion in a table form....

I am new to this.... but I have application which we use to make notes for another program. I have a form with a table inside of it. I can use this code to toggle sections of the table but when you open the form this will only allow the sections to be collapsed. I would like to be able to have some sections expanded and some collapsed, but still be able to control with a click. This code work good for the clicking part but I have not figured out how to get the control I would like. I know there has to be simple way to do this...

$(document).ready(function() {
      $('table.detail').each(function() {
        var $table = $(this);
        $table.find('.parent').click(function() {
            $(this).nextUntil('.parent').toggle(); // must use jQuery 1.4 for nextUntil() method
        });

        var $childRows = $table.find('tbody tr').not('.parent').hide();
        $table.find('button.hide').click(function() {
            $childRows.hide();
        });
        $table.find('button.show').click(function() {
            $childRows.show();
        });
    });
});