我不知道为什么我的代码是错误的？ 有什么问题吗？

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');
        }
    }   

here is my JS code , i dont know what im wrong ? anyone can help ? thanks a lot:) my demo in codepen http://codepen.io/anon/pen/MyRmGy

Answer 1

By changing the class attribute of the images, they will not be found by subsequent calls to document.querySelectorAll('.images')

Set a class attribute that maintains the images class:

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

(If your issue is that the code only works on first link click; you haven't said)