javascript - JS Accordion open first tab by default -


i want open first tab default on accordion. have been trying different solutions, nothing worked me.

here js , html:

 $('.accordion').each(function () {          var $accordian = $(this);          $accordian.find('.accordion-head').on('click', function () {              $(this).parent().find(".accordion-head").removeclass('open close');              $(this).removeclass('open').addclass('close');              $accordian.find('.accordion-body').slideup();              if (!$(this).next().is(':visible')) {                  $(this).removeclass('close').addclass('open');                  $(this).next().slidedown();              }          });      });
<div class="accordion">      <div class="accordion-head">      title here <div class="arrow down"></div>      </div>      <div class="accordion-body">      copy goes here      </div>            <div class="accordion-head">      title here <div class="arrow down"></div>      </div>      <div class="accordion-body">      copy goes here      </div>            <div class="accordion-head">      title here <div class="arrow down"></div>      </div>      <div class="accordion-body">      copy goes here      </div>  </div>

please help.

add following code after each:

$('.accordion .accordion-body:first').show(); $('.accordion .accordion-head:first').addclass('open'); 

this find body of first tab , show it.

demo: https://jsfiddle.net/tusharj/cway1meq/1/

i've re-factored code:

$('.accordion').on('click', '.accordion-head', function () {     $(this).removeclass('close').addclass('close');     $(this).next('.accordion-body').slidetoggle().siblings('.accordion-body').slideup(); }); $('.accordion .accordion-body:first').show(); 

much better!

demo: https://jsfiddle.net/tusharj/cway1meq/2/


Comments

Popular posts from this blog

apache - PHP Soap issue while content length is larger -

asynchronous - Python asyncio task got bad yield -

javascript - Complete OpenIDConnect auth when requesting via Ajax -