[Voivod0]

Начну с самой проблемы и задачей которую необходимо реализовать. Пишу опросник, где каждый вопрос должен отображатся отдельно и иметь индивидуальный стиль, но не нашев ничего подходящего в инете решил написать сам. Но столкнулся с кучей проблем(опишу основную) Задача состоит в том, что есть несколько слоев допустим их 10 в начале у каждого из них z-index равен 1. Нужно чтобы с благодаря z-indexу слои пролистывались.
Это JS

var i;
var mas = [];
for (i =0;i=10;i++){
    mas[i]=i;
}
function on(){
    for (i = 0; i=10; i++ {
        if(mas[i]>mas[i+1]){
            var z = document.getElementById(i+1);
            z.style.zIndex = i+1;
        }else {
            var z = document.getElementById(mas['1']);
            z.style.zIndex = '1';
        }
        }
}

И html

<div id="3" class="box3">awdasdasd</div>
<div id="2" class="box2">sedsefe</div>
<div id="1" class="box">awdawd</div>
<br>
<div class="box0" style="margin: 100px;">
<a href="javascript:on();">Изменить z-index</a></div>

С радостью выслушаю другие варианты решения моей задачи либо замечайний к уже предложенному.