jQuery Simple Collapsible Div?

Question

I am looking for the proper, simple, small code to do the following things:

• Click on Element with Class Applied to it.

• DIV.CLASS - Which expands

Answer 1

Bad idea to use accordion. Better is to create your own collapsible block.

Example:

function InitSpoilBlock(idClicked)
    {
        $(idClicked).on('click', function(e){
            var textArray = ['blind','slide'];//here you can add other effects

            var randomEffect = textArray[Math.floor(Math.random()*textArray.length)];

            $(e.target).parent().children(".HiderPanel").toggle(randomEffect);
        });
    }

so when you write such html:

    More
    

        Spoiled block of html
    

and after page load you will call

InitSpoilBlock('.Hider');

all blocks will be possible to collapse and hide with random animation. Or you can use one exact animation also.