[Wargrant]

Добрый день!
Прошу помочь советом.

У меня есть 2 блока на одной странице, где отображаются картинки.

<img id="111" src="images/eggs-net/egg-net-5.jpg" width="400" alt="" />

<img id="222" src="images/eggs-net/egg-net-6.jpg" width="400" alt="" >

И к ним написаны обработчики для смены картинки. По отдельности они работают, а вместе не хотят. Подскажите как коды сделать уникальными, чтобы id="111" менял свой набор картинок, а id="222" менял свой набор?

<script language="javascript">
var image = document.getElementById("111");
image.addEventListener("click", function(){
   if (image.getAttribute("src") == "images/eggs-net/egg-net-5.jpg"){
      image.src = "images/eggs-net/egg-net-5-2.jpg"}
   else{
      image.src = "images/eggs-net/egg-net-5.jpg"}
});
</script>

<script language="javascript">
var image = document.getElementById("222");
image.addEventListener("click", function(){
   if (image.getAttribute("src") == "images/eggs-net/egg-net-6.jpg"){
      image.src = "images/eggs-net/egg-net-6-2.jpg"}
   else{
      image.src = "images/eggs-net/egg-net-6.jpg"}
});
</script>