jquery hide show content onclick-cleaner代码

基本上，我想要的是当你点击某个元素时（例如：#click1#click2#click3），某个div就变得可见了。单击另一个元素时，会显示另一个div，但它会隐藏上一个div，依此类推。我已经有了代码，但感觉我重复了太多。我的意思是，如果有15个元素在单击时会显示不同的内容呢？有没有更干净的方法？链接到 代码：

//html

A
B
C

布拉
布拉
布拉
//JS
$（.DIV1.DIV2.DIV3”）.addClass（“隐藏”）；
$（“#单击1”）。单击（函数（）{
$（“.DIV1”）.show（）；
$（.DIV2.DIV3”）.hide（）；
});
$（“#单击2”）。单击（函数（）{
$（“.DIV2”）.show（）；
$（.DIV1.DIV3”）.hide（）；
});
$（“#单击3”）。单击（函数（）{
$（“.DIV3”）.show（）；
$（.DIV1.DIV2”）.hide（）；
});

以下是最基本的方法：

$('li').click(function () {
    $('div').hide().eq($(this).index()).show()
})

---

当然，如果页面中有其他列表和div，这会有问题，解决方法是用一个易于选择的标识符（如类或ID）将要定位在元素（例如div）中的列表/div块包装起来。但是，由于您给出了一个基本代码示例，我给了您一个简单的解决方案；）

您可以向元素中添加多个类名，这样您就可以对它们进行分组。不，这非常适合我的需要。我知道必须有更聪明的方法：）谢谢

$('li').click(function () {
    $('div').hide().eq($(this).index()).show()
})