end javascript after function?
<p>I'm getting a problem with my javasctipt. basically it's set up to hide two div layers that fade in after each other each time the user presses a button. </p>

<p>So if they press it once, div layer 1 hides and div layer 2 fades in. if they press it again, div layer 2 hides and layer 3 fades in.</p>

<p>It's working fine, but if the user presses the button a third time all the divs sort of spew out on top of each other and all unhide. Can i stop this from happening?</p>

<p>I'm a javascript beginner and don't know alot so if someone could please show me that would help. thanks.</p>

<pre><code>&lt;script&gt;
$(".modcontentnewestmore").hide();
$(".modcontentnewestmore2").hide();
$('.morebutton').click(function () {
    if ($('.modcontentnewestmore').is(":hidden")) {
         $(".modcontentnewestfirst").fadeOut(500);
         $('.modcontentnewestmore').delay(700).fadeIn(500);

    } else {

        $('.modcontentnewestmore').fadeOut(500);
              $('.modcontentnewestmore2').delay(700).fadeIn(500);



    }


  });


&lt;/script&gt;
</code></pre>
