Javascript-форум - Инвертация значения из функции

Javascript-форум (https://javascript.ru/forum/)

- Общие вопросы Javascript (https://javascript.ru/forum/misc/)

- - Инвертация значения из функции (https://javascript.ru/forum/misc/63736-invertaciya-znacheniya-iz-funkcii.html)

Инвертация значения из функции

Уважаемые мастера, подскажите пожалуйста:

<html>
<head>
<title>Knopki</title>
<script language="JavaScript">
var img = new Array('off.png','on.png');
var kn = new Array('km1','km2','km3');
var start=0;


function gmi(id,zn) {
if (start==0){
start=1;
document.getElementById('q').innerHTML='<img id="km1" src="off.png" onclick="gmi(this.id,0)">';
document.getElementById('a').innerHTML='<img id="km2" src="off.png" onclick="gmi(this.id,1)">';
document.getElementById('z').innerHTML='<img id="km3" src="off.png" onclick="gmi(this.id,2)">';
}else{
//Всё прекрасно работает, каждая кнопка индивидуально переключается
kn[zn]=(kn[zn]==1)?0:1; 
console.log(kn[zn]);
document.getElementById(id).src=img[kn[zn]];
//Всё прекрасно работает, каждая кнопка индивидуально переключается
//Но если делаю так
//var iu = id;
//iu=(iu==1)?0:1; 
//console.log(iu);
//document.getElementById(id).src=img[iu];
//То значение iu меняется на 1, а на 0 не меняется
//Почему?
}
}
</script>
</head>

<body onload="gmi()">
<p><span id="q"></span></p>
<p><span id="a"></span></p>
<p><span id="z"></span></p>

</body>
</html>

Создание кнопок on off

Ser8191,

<html>
<head>
<title>Knopki</title>
<meta charset="utf-8">
<script>
var img = ["http://icons.iconarchive.com/icons/hopstarter/soft-scraps/72/Button-Turn-Off-icon.png", "http://icons.iconarchive.com/icons/hopstarter/soft-scraps/72/Button-Turn-On-icon.png"],
    kn = ["q", "a", "z"];
window.addEventListener("DOMContentLoaded", function() {
    kn.forEach(function(b) {
        var a = new Image,
            c = 0;
        a.addEventListener("click", function() {
            this.src = img[c = +!c]
        });
        a.src = img[0];
        document.querySelector("#" + b).appendChild(a)
    })
});
</script>
</head>

<body>
<p><span id="q"></span></p>
<p><span id="a"></span></p>
<p><span id="z"></span></p>

</body>
</html>