使用jquery仅显示/隐藏同一页面上多个元素中的一个

我有一个页面，我有几个不同的子导航元素在不同的位置

我的分数是（基本上）

---

目前，这可以工作，但会打开所有名为的相关元素。如何使jquery工作，使其只调用相关元素，而不调用所有元素

slideToggle

因此，这项工作的方式是，我为演示放了一些示例文本**单击

foo

，您将看到它的

ul

，如果单击

fp

，您将看到它的

ul

向下滑动等等

jquery代码

  $(document).ready(function () {

 $('.sub-nav ul').css("display","none");
    // Watch for clicks on the "slide" link.
    $('.sub-nav-btn').click(function () {
        $(this).next(".sub-nav ul").slideToggle(400);
        return false;
    });


});​

$('.sub-nav ul').css("display","none");
$('.sub-nav-btn').click(function(){
$('.sub-nav ul').toggle();
return false;
});

  $(document).ready(function () {

 $('.sub-nav ul').css("display","none");
    // Watch for clicks on the "slide" link.
    $('.sub-nav-btn').click(function () {
        $(this).next(".sub-nav ul").slideToggle(400);
        return false;
    });


});​

$('.sub-nav ul').hide();
$('.sub-nav-btn').click(function(){
    $(this).siblings('ul').toggle('slow');
});​