Я не знаю, почему мой код не так? и что не так?

Question

document.getElementById("link1").addEventListener("click", c); 
    function c(){ 
     var a = document.querySelectorAll('.images'); 
     for(var k in a){ 
      a[k].setAttribute('class','col-md-12'); 
     } 
    } 
document.getElementById("link2").addEventListener("click", d); 
    function d(){ 
     var a = document.querySelectorAll('.images'); 
     for(var k in a){ 
      a[k].setAttribute('class','col-md-6'); 
     } 
    } 
document.getElementById("link3").addEventListener("click", e); 
    function e(){ 
     var y = document.querySelectorAll('.images'); 
     for(var z in y){ 
      y[z].setAttribute('class','col-md-4'); 
     } 
    } 

вот мой код JS, я не знаю, что я не так? любой может помочь? спасибо :) мой демо в codepen http://codepen.io/anon/pen/MyRmGy

Answer 1

Изменяя атрибут изображений class, они не будут найдены при последующих вызовах document.querySelectorAll('.images')

Установить атрибут класса, который поддерживает images класс:

a[k].setAttribute('class', 'col-md-12 images'); 

(Если ваш вопрос о том, что код работает только на первой линии мыши, вы не сказали)