jQuery实现点击展开其他自动关闭

<script type="text/javascript" src="jquery-1.8.2.min.js"></script>
<script type="text/javascript">
$(function(){
$(".box .title").click(function(){
$(this).next(".con").slideToggle().siblings(".con").hide();
var text = $(this).children("a");
if($(text).html() == "关闭"){
$(text).html("显示");
}else{
$(text).html("关闭");
}
$(this).siblings(".title").children("a").html("显示");
});
});
</script>

<style type="text/css">
.box {
width:200px;
}
.box .title {
height:25px;
padding:0 5px;
background-color:#eee;
font-size:12px;
line-height:25px;
cursor:default;
border-bottom:1px solid #e5e5e5;
}
.box .title a {
margin-left:10px;
float:right;
}
.box .con {
font-size:16px;
font-weight:bold;
height:50px;
background-color:#f5f5f5;
text-indent:10px;
line-height:50px;
}
</style>

<div class="box">
<div class="title"><span>标题一</span><a>关闭</a></div>
<div class="con">内容一</div>
<div class="title"><span>标题二</span><a>显示</a></div>
<div class="con" style="display:none;">内容二</div>
</div>