는 클릭에서 Active 아코디언 패널을 닫을 ... 아코디언 원활하게 작동 항상

Question

http://jsfiddle.net/buhlett/paw5w/

에 하나 개의 패널을 열 수있을 것 같습니다하지만 그것은 나를 한 번에 모든 패널을 닫을 수 없습니다. 한 패널은 항상 강제로 열립니다.

은 내가

$(document).ready(function() { 
// Store variables 
var accordion_head = $('.grape-accordion > li > a'), 
    accordion_body = $('.grape-accordion li > .grape-sub-menu, .grape-last-sub-menu'); 
// Open the first tab on load 
// Click function 
accordion_head.on('click', function(event) { 
    // Disable header links 
    event.preventDefault(); 
    // Show and hide the tabs on click 
    if ($(this).attr('class') != 'active') { 
     accordion_body.slideUp('normal'); 
     $(this).next().stop(true, true).slideToggle('normal'); 
     accordion_head.removeClass('active'); 
     $(this).addClass('active'); 
    } 
}); 
});​ 

는 HTML

<div> 
    <ul class="grape-accordion"> 
     <li id="one" class="share"><a href="#one">-</a> 
     <ul class="grape-sub-menu"> 
      <li><a href="#"><em>»</em>-</a></li> 
     </ul> 
     </li> 
     <li id="two" class="mail"><a href="#two">-</a> 
     <ul class="grape-sub-menu"> 
      <li><a href="#"><em>»</em>-</a></li> 
     </ul> 
     </li> 
     <li id="two" class="mail"><a href="#two">-</a> 
     <ul class="grape-sub-menu"> 
      <li><a href="#"><em>»</em>-</a></li> 
     </ul> 
     </li> 
    </ul> 
</div>