class=“type-tit”层是多个值，每个值相当于一个菜单，我想每点击一个菜单把下面的子菜单显示出来，用jquery该怎样实现？？？？

<script type="text/javascript">
$(document).ready(function(){
$(".type-tit").click(function(){
$(".sub").slideToggle();
});

});
</script>
div class="works-left fl">
            <div class="works-tit"><h1>按分类查看</h1></div>
              <ul >
              <li>
              [@cms_channel_list parentId=channel.nodeList[0].id]
                 [#list tag_list as sub]
                <h3><div class="type-tit"><a href="${sub.url}" id="hf">${sub.name}</a></div></h3>
                 [@cms_channel_list parentId=sub.id]
                     [#list tag_list as sub1]
                 <dd class="sub" ><a href="${sub1.url}">${sub1.name}</a></dd>
                     [/#list]
                    [/@cms_channel_list]  
                  [/#list]
              [/@cms_channel_list]   
              </li>
              </ul>
         </div>

补充：Java ,  Web 开发