CODEWITHSUNDEEP
javascriptjquery
Umesh Awasthi
Umesh Awasthi

Reputation: 23587

enabling and disabling accordion with Jquery

I have got an HTML page for my checkout process where i need to enable and disable accordion based on the user inputs.

This is the initially code i got from the UI developer.

$(document).ready(function() {
   //ACCORDION BUTTON ACTION    
    $('div.accordionButton').click(function() {
        $('div.accordionContent').not($(this).next()).hide();
              $(this).next('div.accordionContent').slideToggle('normal');
                //$(this).next().slideDown('normal');
     });
});

For all disable div/accordion , we are using accordionButton2 class and once use successfully pass that step, i am changing the class of the div so that it should be enable and click function should work.

This is working fine for the first time, but when user is moving ahead, it seems that it is not picking all those div whose class has been changed to accordionContent from accordionContent2.

It seems to me that it is only picking all those div with class set as accordionContent on page load and after that it is not picking up anything.

i also tried 

$('div.accordionButton').bind('click', function() {

but seems like it is also not working How can i achieve this in Jquery, so that i will be able to enable and disable accordion at run time

Upvotes: 1

Views: 333

Answers (1)

PSR
PSR

Reputation: 40318

$(document).on('click','div.accordionButton',function() {
        $('div.accordionContent').not($(this).next()).hide();
              $(this).next('div.accordionContent').slideToggle('normal');
                //$(this).next().slideDown('normal');
     });

Upvotes: 2

Related Questions