JQuery: Accordion style menu toggle

I'm trying to make a simple accordion style menu using divs:

<div class="subdomainLevel">
    Subdomain <a href="#" class="pageToggle">open/close</a>

    <div class="pageLevel">Page Level <a href="#" class="messageToggle">open/close</a>
        <div class="pageMessage">Message</div>
    </div>

</div>

<div class="subdomainLevel">
    Subdomain <a href="#" class="pageToggle">open/close</a>

    <div class="pageLevel">Page Level <a href="#" class="messageToggle">open/close</a>
        <div class="pageMessage">Message</div>
    </div>

</div>

My jquery is as follows:

var page = $(".subdomainLevel").children(".pageLevel");
$(".pageToggle").click(function () {
    $(page).slideToggle("fast");
});

How can I make my JQuery reusable so that when I click on m开发者_JAVA百科y "open/close" link, the link only controls the child of that div and not the other divs on the page with the same class.

Thanks,

instead of:

 $(page).slideToggle("fast");

use:

$(this).siblings('.pageLevel').slideToggle("fast");

example at:

http://jsfiddle.net/2CEmx/

Edit: so you don't really need this line at all:

var page = $(".subdomainLevel").children(".pageLevel");

Try this:

$(this).next(".pageLevel").slideToggle("fast");