JQuery 写bootstrap手风琴效果

<div class="panel panel-info">
<div class="panel-heading">
<h3 class="panel-title"><a href="javascript:;">日期</a></h3>
</div>
<div class="panel-body">
Some default panel content here. Nulla vitae elit libero, a pharetra augue. Aenean lacinia bibendum nulla sed consectetur. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Nullam id dolor id nibh ultricies vehicula ut id elit.
</div>
</div>
<div class="panel panel-primary">
<div class="panel-heading">
<h3 class="panel-title"><a href="javascript:;">价格</a></h3>
</div>
<div class="panel-body">
Some default panel content here. Nulla vitae elit libero, a pharetra augue. Aenean lacinia bibendum nulla sed consectetur. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Nullam id dolor id nibh ultricies vehicula ut id elit.
</div>
</div>
<div class="panel panel-success">
<div class="panel-heading">
<h3 class="panel-title"><a href="javascript:;">距离</a></h3>
</div>
<div class="panel-body">
Some default panel content here. Nulla vitae elit libero, a pharetra augue. Aenean lacinia bibendum nulla sed consectetur. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Nullam id dolor id nibh ultricies vehicula ut id elit.
</div>
</div>
<script type="text/javascript">
$('.panel-body').hide();
$('.panel-title').click(function(){
$(this).parent().next().slideToggle();
$('.panel-body').not($(this).parent().next()).slideUp();
});
</script>