[Vahan60]

Доброго времени суток.
Такая проблема - хочу, чтобы по клику на кнопку картинки менялись, а по повторному клику все возвращались на свои места.
Первый клик и первый обмен происходят штатно.
А вот повтор не работает.
Почему? Что не так делаю?

const colors = [
        ["colo/colZ1/Path_0.png", "colo/colZ2/Path_0.png"], 
	["colo/colZ1/Path_1.png", "colo/colZ2/Path_1.png"], 
	["colo/colZ1/Path_2.png", "colo/colZ2/Path_2.png"], 
	["colo/colZ1/Path_3.png", "colo/colZ2/Path_3.png"] 
];

// размещаем картинки 1-ой группы по местам при запуске сайта

let img = document.querySelectorAll(".img") 
for (let i = 0; i < colors.length; i++) {
    img[i].src = colors[i][0];
	img.display
    };

// меняем картинки на 2-ую группу на местах по клику на bttn

let bttn = document.querySelector (".bttn");  // меняем картинки на местах 
bttn.addEventListener ("click", function () {
  for (let i = 0; i < colors.length; i++) {
    img[i].src = colors[i][1];
	img.display
    };
});

// а вот обратного действия ( смена картинок 2-ой группы на картинки 1-ой группы по клику по той же bttn) не происходит

bttn.addEventListener ("click", function() {
  for (let i = 0; i < colors.length; i++) {
    img[i].src = colors[i][0];
	img.display
    };
});