Javascript 使用Colapsable列表隐藏和显示图像

我有一个可折叠的单选按钮列表。根据单击的单选按钮，会弹出不同的图像。这就是我所拥有的-

$（'radio1-1'）。单击（功能（e）{
e、 停止传播（）；
$（'#img1'）.show（）；
$（'#img2'）.hide（）；
$（'#img3'）.hide（）；
$（'#img4'）.hide（）；
});
$（'#radio1-2'）。单击（函数（e）{
e、 停止传播（）；
$（'#img1'）.hide（）；
$（'#img2'）.show（）；
$（'#img3'）.hide（）；
$（'#img4'）.hide（）；
});
$（“#radio2-1”）。单击（函数（e）{
e、 停止传播（）；
$（'#img1'）.hide（）；
$（'#img2'）.hide（）；
$（'#img3'）.show（）；
$（'#img4'）.hide（）；
});
$（“#radio2-2”）。单击（函数（e）{
e、 停止传播（）；
$（'#img1'）.hide（）；
$（'#img2'）.hide（）；
$（'#img3'）.hide（）；
$（'#img4'）.show（）；
});
$（'body'）。单击（函数（）{
$（'#img1，#img2，#img3，#img4'）.hide（）；
});
var chanceoflive5=1；
var用户；
var chanceoflive6=1；
var user2；
var acc=document.getElementsByClassName（“accordion”）；
var i；
对于（i=0；i

button.accordion{
背景色：#eee；
颜色：#444；
光标：指针；
填充：18px；
宽度：100%；
边界：无；
文本对齐：左对齐；
大纲：无；
字体大小：15px；
过渡：0.4s；
}
按钮。手风琴。激活，按钮。手风琴：悬停{
背景色：#ddd；
}
按钮。手风琴：之后{
内容：“\002B”；
颜色：#777；
字体大小：粗体；
浮动：对；
左边距：5px；
}
按钮。手风琴。激活：之后{
内容：“\2212”；
}
分区小组{
填充：0 18px；
最大高度：0；
溢出：隐藏；
过渡：0.6s缓进缓出；
不透明度：0；
}
div.panel.show{
不透明度：1；
最大高度：500px；
}
身体{
字体系列：无衬线；
字体大小：正常；
利润率：10px；
颜色：#999；
背景图片：url（“bridge.jpg”）；
}
形式{
利润率：40px0；
}
div{
明确：两者皆有；
边际：0.50px；
}
标签{
边界半径：3px；
边框：1px实心#D1D3D4
}
/*隐藏输入*/
输入。收音机：空{
左边距：-999px；
}
/*样式标签*/
输入。收音机：空~标签{
位置：相对位置；
浮动：左；
线高：2.5em；
文本缩进：3.25em；
边缘顶部：2米；
光标：指针；
-webkit用户选择：无；
-moz用户选择：无；
-ms用户选择：无；
用户选择：无；
}
输入。收音机：空~标签：前{
位置：绝对位置；
显示：块；
排名：0；
底部：0；
左：0；
内容：''；
宽度：2.5em；
背景：#D1D3D4；
边界半径：3px 0 3px；
}
/*切换悬停*/
输入。收音机：悬停：未（：选中）~标签：在之前{
内容：'\2714'；
文本缩进：.9em；
颜色：#C2C2；
}
输入。收音机：悬停：未（：选中）~label{
颜色：#888；
}
/*打开*/
输入。收音机：选中~标签：之前{
内容：'\2714'；
文本缩进：.9em；
颜色：#9CE2AE；
背景色：#4DCB6D；
}
输入。收音机：选中~标签{
颜色：#777；
}
手风琴{
背景色：#eee；
颜色：#444；
光标：指针；
填充：18px；
宽度：100%；
边界：无；
文本对齐：左对齐；
大纲：无；
字体大小：15px；
过渡：0.4s；
}
按钮。手风琴。激活，按钮。手风琴：悬停{
背景色：#ddd；
}
按钮。手风琴：之后{
内容：“\002B”；
颜色：#777；
字体大小：粗体；
浮动：对；
左边距：5px；
}
按钮。手风琴。激活：之后{
内容：“\2212”；
}
分区小组{
填充：0 18px；
最大高度：0；
溢出：隐藏；
过渡：0.6s缓进缓出；
不透明度：0；
}
div.panel.show{
不透明度：1；
最大高度：500px；
}
身体{
字体系列：无衬线；
字体大小：正常；
利润率：10px；
颜色：#999；
}
形式{
利润率：40px0；
}
div{
明确：两者皆有；
边际：0.50px；
}
标签{
边界半径：3px；
边框：1px实心#D1D3D4
}
/*隐藏输入*/
输入。收音机：空{
左边距：-999px；
}
/*样式标签*/
输入。收音机：空~标签{
位置：相对位置；
浮动：左；
线高：2.5em；
文本缩进：3.25em；
边缘顶部：2米；
光标：指针；
-webkit用户选择：无；
-moz用户选择：无；
-ms用户选择：无；
用户选择：无；
}
输入。收音机：空~标签：前{
位置：绝对位置；
显示：块；
排名：0；
底部：0；
左：0；
内容：''；
宽度：2.5em；
背景：#D1D3D4；
边界半径：3px 0 3px；
}
/*切换悬停*/
输入。收音机：悬停：未（：选中）~标签：在之前{
内容：'\2714'；
文本缩进：.9em；
颜色：#C2C2；
}
输入。收音机：悬停：未（：选中）~label{
颜色：#888；
}
/*打开*/
输入。收音机：选中~标签：之前{
内容：'\2714'；
文本缩进：.9em；
颜色：#9CE2AE；
背景色：#4DCB6D；
}
输入。收音机：选中~标签{
颜色：#777；
}
#容器{
宽度：500px；
保证金：自动；
}
/*霓虹灯*/
p{
文本对齐：居中；
字号：7em；
保证金：20px 0 20px 0；
}
a{
文字装饰：无；
-webkit过渡：所有0.5s；
-moz转换：所有0.5s；
过渡：均为0.5s；
}
第n个孩子（2）a{
字体大小：0.5em；
颜色：#228DFF；
字体系列：冰岛；
}
第n个孩子（2）a:悬停{
-webkit动画：neon2 1.5s轻松输入输出无限交替；
-moz动画：neon21。