Custom JQuery accordion - need help setting first item to be open by default.

Hi,

Found the following accordion example online, works great however I want it to be open at the first item by default. How can I modify code below to allow first item to be open?


<script language="javascript" type="text/javascript">
        $(document).ready(function () {
            //ACCORDION BUTTON ACTION      
            $('div.accordionButton').on('click',function () {
                $('div.accordionContent').slideUp('normal');
                $(this).next().slideDown('normal');
            });

            //HIDE THE DIVS ON PAGE LOAD      
            $("div.accordionContent").hide();

        });
      </script>


<div id="acc-wrapper">
            <div class="accordionButton">Item1</div>
            <div class="accordionContent">Content 1<br /><br /><br /><br /><br /><br /><br /><br />Long Example</div>
            <div class="accordionButton">Item2</div>
            <div class="accordionContent">Content 2<br /><br /><br /><br /><br />Medium Example</div>
            <div class="accordionButton">Item3</div>
            <div class="accordionContent">Content 1<br />Short Example</div>
            <div class="accordionButton">Item4</div>
            <div class="accordionContent">Content 4<br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br />Extra Long Example</div>
      </div>
LVL 2
jazz__manAsked:
Who is Participating?
 
animecycCommented:
In your javascript change:

$("div.accordionContent").hide();

Open in new window


to:

$("div.accordionContent").not(':first').hide();

Open in new window

0
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

All Courses

From novice to tech pro — start learning today.