JS入门选手 求大神帮忙看看这段JS怎么简化

[suijimingzi]

$(document).ready(function(){
$(".planwrapper .zx #checkbox_c1").click(function(){
if($(this).is(':checked')){
$(".tbr").fadeIn();
$(this).parent().prev().find("input").attr("checked",true);
}
else if($(this).not(':checked')){
$(".tbr").fadeOut();
$(this).parent().prev().find("input").attr("checked",false);
}
});
$(".planwrapper .zx #checkbox_c2").click(function(){
if($(this).is(':checked')){
$(".bbr").fadeIn();
$(this).parent().prev().find("input").attr("checked",true);
}
else if($(this).not(':checked')){
$(".bbr").fadeOut();
$(this).parent().prev().find("input").attr("checked",false);
}
});


});

这就是一个点击隐藏显示的代码 有两个按钮 点第一个显示/隐藏第一个的DIV 点第二个显示/隐藏第二个的DIV
我知道还有更好的办法写这种效果 但是我就是问上面这段代码怎么改能简化

[木头海上漂]

俩个click合并，使用共同的选择器。。。事件内部使用index值级数组中的序号来区分控制哪个div

[天际的海浪]

#checkbox_c1和#checkbox_c2改用一样的class。 如 $(".planwrapper .zx .className").click(function(){ $(".tbr")也要改用根据当前元素相对查找