How to make collapsed content to be expanded on load


$(document).ready(function() {  

      open: function() {


        el = this.parent().find("h3 a")[0];

        $(el).text("-").prop('title', 'Collapse');


      close: function() {


        el = this.parent().find("h3 a")[0];
        $(el).text("+").prop('title', 'Expand');

      accordion: true,
      persist: false

I have this code and on loading the page the content is collapsed, so i click on ‘+’ and it gets expanded. I want it to be expanded on load ( respectfully, the icon will be ‘-‘ and the content will be expanded, and after clicking it, it will change into ‘+’ and the content would be collapsed.


Add the following class to your object:


It will be open by default.

Answered By – ltalhouarne

This Answer collected from stackoverflow, is licensed under cc by-sa 2.5 , cc by-sa 3.0 and cc by-sa 4.0

Leave a Reply

(*) Required, Your email will not be published