一个页面上有多个javascript元素？

我几乎不懂javascript，我只需要为艺术课做点什么。基本上，我希望在同一页上有多个图像，每个图像在3个图像之间切换

以下是脚本：

 var images = ["images/image1.png", "images/image2.jpg", "images/image3.jpg"];
 var clicks = 0;

 $(document).ready(start);

 function start(){
     $("#panel_1").click(changeImage);
 }

 function changeImage(){
     clicks++;
     img = images[clicks % images.length];
     $("#panel_1").attr("src", img);
 }

下面是HTML：

 <div id="panel1">
 <a href="#">
    <img id="panel_1" border="0" src="images/SquirrelFull.jpg" width="230px" height="230px"/>
 </a>
 </div>

---

现在，我想要所有这些，但第二个，使面板2（和3，4，5等）

只要这样做，创建另一个面板，使用不同的ID，创建另一个img数组。在一秒钟内，一些noob会为你做这件事，或者你可以告诉我们你尝试了什么，但没有成功，尽管论坛更适合此类问题。当我添加另一个面板时，我不知道如何制作不同的var图像，以便每个图像与3个不同的图像切换。因此，当我这样做时，panel_1和panel_2在相同的6个图像之间切换。我尝试使用var images1、var images2和var clicks1和var clicks2，但这似乎不起作用。使用代码u尝试更新问题，panel_1和panel_2示例。