Javascript Jquery-将链接颜色与显示的图像匹配

我有一个底部有3个圆圈的滑块，当显示图片时，正确的圆圈背景必须变成绿色，与正确的图像相关。我让它工作，但当用户点击一个新的圆圈，以改变图像，旧的背景颜色保持不变，不会消失，正如你可以从图片示例中看到的

在上面的示例中，加载了突出显示的middel图像的页面，当用户单击右圆圈时，图像发生了变化，并突出显示了右圆圈（正如它应该的那样），但中间按钮的突出显示颜色保持不变……我在这里缺少什么？代码如下：

$(document).ready(function(){
    $("a").click(function(){
      $("iLink").removeClass()
        $(this).addClass("over")  
    }) ; 
});

.over {
    background:#008000;
}

<a href="#" id="l1" class="iLink1"  onclick="imgSliderL1()"><img id="i1" src="images/dot.png"/></a>
     <a href="#" id="l2" class="iLink2" onclick="imgSliderL2()"><img id="i2" src="images/dot.png" /></a>
     <a href="#" id="l3" class="iLink3" onclick="imgSliderL3()"><img id="i3" src="images/dot.png" /></a>

$（文档）.ready（函数（）{
$（“a”）。单击（函数（）{
$（“iLink”）.removeClass（）
$（此）.addClass（“结束”）
}) ; 
});
.结束{
背景：#008000；
}
什么是
iLink

$("iLink").removeClass()

改为

 $('a').removeClass()

为什么需要不同的类？
选择该id并关联要选择的id的条件，而不是使用jquery的css属性或css函数。
更改

$("iLink").removeClass()

到

因为a标记包含不同的类，但它们都以相同的名称iLink开头，仅供参考：当您请求类名时，需要在名称前使用
（点）。这个
$（.iLink”）
应该是
$（.iLink”）
$("a[class^='iLink']").removeClass()