Jquery collapse issue
<p>on load its look like this.<br>
<img src="http://i.stack.imgur.com/czwF1.png" alt="enter image description here"></p>

<p>on expand like this <br>
<img src="http://i.stack.imgur.com/Osmbb.png" alt="enter image description here"></p>

<p>if i click know how + sign then it will collapse whats new  that works fine.</p>

<p>But if click on whats new and again on whats new then collapse works fine
but Image of + sign doesnt change.</p>

<p>I have to change that sign also. please help, Thanks in advance.</p>

<p>HTML</p>

<pre><code>&lt;div class="Wobnavi"&gt;
    &lt;ul class="rootFolders"&gt;

            &lt;li id="wobsubfolder1"&gt;
            &lt;h2 class="more_folders" id="wobsubfolder1"&gt; &lt;a href="#"&gt;WHAT'S NEW?&lt;/a&gt; &lt;/h2&gt;

                   &lt;ul class="subFolders"&gt;

                        &lt;li&gt;
                            &lt;a href="#"&gt;test&lt;/a&gt;
                        &lt;/li&gt;

                   &lt;/ul&gt;

            &lt;/li&gt;

            &lt;li id="WOB-events-folder"&gt;
            &lt;h2 class="null" id="WOB-events-folder"&gt; &lt;a href="#"&gt;EVENTS&lt;/a&gt; &lt;/h2&gt;

            &lt;/li&gt;

            &lt;li id="wobsubfolder2"&gt;
            &lt;h2 class="more_folders" id="wobsubfolder2"&gt; &lt;a href="#"&gt;KNOW-HOW&lt;/a&gt; &lt;/h2&gt;

                   &lt;ul class="subFolders"&gt;

                        &lt;li&gt;
                            &lt;a href="#"&gt;Legacy &amp;amp; brand values&lt;/a&gt;
                        &lt;/li&gt;

                   &lt;/ul&gt;

            &lt;/li&gt;

            &lt;li id="wobsubfolder3"&gt;
            &lt;h2 class="null" id="wobsubfolder3"&gt; &lt;a href="#"&gt;ATTRACTIONS&lt;/a&gt; &lt;/h2&gt;

            &lt;/li&gt;

            &lt;li id="HERITAGE"&gt;
            &lt;h2 class="null" id="HERITAGE"&gt; &lt;a href="#"&gt;heritage&lt;/a&gt; &lt;/h2&gt;

            &lt;/li&gt;

    &lt;/ul&gt;
&lt;/div&gt;
</code></pre>

<p>jquery:</p>

<pre><code>jQuery(document).ready(function(){
   jQuery('.Wobnavi .rootFolders h2').click(function(){
    var main = jQuery('.Wobnavi .rootFolders h2');
                 var clk = jQuery(this);
                 var it = main.hasClass('less_folders') ?  (main.removeClass('less_folders'), clk.toggleClass('less_folders')) : clk.toggleClass('less_folders');

var co = jQuery('.subFolders');
                 var el = jQuery(this).next(co);   
                 var doit =  el.is(':hidden') ? ( co.slideUp('1000'), el.slideDown('1000')) : co.slideUp('1000') ;
                });
        });
</code></pre>
