multiple divs open accordion

I have modified the jquery accordion to show more than one opened divs like this:

$(function() {
        var icons = {
            header: "ui-icon-circle-arrow-e",
            headerSelected: "ui-icon-circle-arrow-s"
        };
        jQuery('#accordion').accordion({
           开发者_高级运维  icons: icons,
             collapsible: true,
             active: false,
             autoHeight: false,
             navigation: true, 
             disabled: true });

            jQuery('#accordion h3.ui-accordion-header').click(function() {
                jQuery(this).next().slideToggle();
            });

    });

It works fine except one thing that when I click any header, It expands but arrow on header doesn't change.

I followed following link:

http://sammybrent.inelsternwick.com/blog/?p=30

Please suggest solution.

Basically, you're trying to mimic the accordion-behaviour. But on a click, that's not everything the accordion does. It changes the classes of the arrow and the headers too, which changes the picture.

So what you could do to get the arrows right is to change the class from ui-icon-circle-arrow-e to ui-icon-circle-arrow-s and vice versa if the header is clicked. Adding something like:

$(this).find('.ui-icon').toggleClass('ui-icon-circle-arrow-e ui-icon-circle-arrow-s');

would work I guess. I don't think using the accordion like this is a very good solution btw.