I have a step-by-step process in jQuery, is there a better way to code it?
<p>I have a step-by-step process that guides a user through a setup process. I want all the code contained in one page (meaning I have setup.php, not step1.php, step2.php, and step3.php). I've coded it in jQuery like this: (it only shows one step at a time)</p>

<pre><code>$(document).ready(function() {
    // Hide all sections
    $("article").hide();

    // Show intro
    $("#intro").fadeIn("slow").delay(500).slideDown("slow", function() {
        // Listen for user to click "next" link
        $("#intro .next").click(function() {
            // Hide intro
            $("#intro").fadeOut("fast").delay(500).slideUp("fast", function() {
                // Show EULA section
                $("#eula").fadeIn("slow").delay(500).slideDown("slow", function() {
                    // Listen for user to click "next" link
                    $("#eula .next").click(function() {
                        $("#eula").fadeOut("fast").delay(500).slideUp("fast", function() {
                            // Show site section
                            $("#site").fadeIn("slow").delay(500).slideDown("slow", function() {
                                // Listen for user to click "next" link
                                $("#site .next").click(function() {
                                    $("#site").fadeOut("fast").delay(500).slideUp("fast", function() {
                                        // Show database section
                                        $("#database").fadeIn("slow").delay(500).slideDown("slow", function() {
                                            // Listen for user to click "next" link
                                            $("#database .next").click(function() {
                                                $("#database").fadeOut("fast").delay(500).slideUp("fast", function() {
                                                    // Show email section
                                                    $("#email").fadeIn("slow").delay(500).slideDown("slow", function() {
                                                        $("#email .next").click(function() {
                                                            $("#email").fadeOut("fast").delay(500).slideUp("fast", function() {
                                                                // Submit form to PHP script
                                                                $("#done").fadeIn("slow").delay(500).slideDown("slow", function() {

                                                                });
                                                            });
                                                        });
                                                    });
                                                });
                                            });
                                        });
                                    });
                                });
                            });
                        });
                    });
                });
            });
        });
    });
});
</code></pre>

<p>Yes, I realize this is terribly ugly, but I don't know another way to do it? Can anyone recommend a better way?</p>
