Как закрыть другой элемент при нажатии с помощью .slideToggle

Question

Я пытаюсь сделать меню аккордеона, как бы то ни было, мне нужно, чтобы меню открывалось только 1. Как мне закрыть другую ли при щелчке?

Ниже приведен код, который я использую для переключения меню. Как настроить таргетинг на все другие лики, чтобы закрыть их при нажатии кнопки li.

<li class="cat_parent"> 
    <h2 class="head par_title">Books</h2> 
    <div class="content">01</div> 
    <div class="content">02</div> 
</li> 
<li class="cat_parent"> 
    <h2 class="head par_title">Magazine</h2> 
    <div class="content">01</div> 
    <div class="content">02</div> 
    <div class="content">03</div> 
    <div class="content">04</div> 
</li> 

$(document).ready(function(){ 
    ('.head').click(function(e){ 
     e.preventDefault(); 
     $(this).closest('li').find('.content').slideToggle(); 
    }); 
}); 

Ваша помощь очень ценится!

Answer 1

попробовать это

$('.cat_parent').find('div').hide(); 

$('.head').click(function(e){ 
     e.preventDefault(); 
     $(this).siblings().slideDown('slow'); 
     $(this).parents('.cat_parent').siblings().find('div').slideUp('slow'); 
    }); 

http://jsfiddle.net/kanishka_bandara/GfyZf/