Проблема со слоями css

[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>

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

[danik.js]

Нужно чтобы с благодаря z-indexу слои пролистывались.

Просто выставляй слою, который нужно отобразить больший индекс, чем изначальный. Нет необходимости менять индексы всем слоям.

[Voivod0]

Просто выставляй слою, который нужно отобразить больший индекс, чем изначальный. Нет необходимости менять индексы всем слоям.

Еще раз повторюсь. Мне нужно чтобы скрипт по нажатию кнопки менял zindex на +1 следущего слоя. А вообще я просто попросил проверить мой код который по неизвестным мне причинам просто отказывается работать

[danik.js]

Мне нужно чтобы скрипт по нажатию кнопки менял zindex на +1 следущего слоя.

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

[lord2kim]

Voivod0, danik.js правильно вам говорит...
а по поводу вашего кода...цикл будет работать пока выполняется второе условие (в вашем случае i = 10), а как мы можем видеть на первой же итерации условие не выполняется...

[rekzi]

А чем css display: block/none не угодил? z-index в IE чудит.

[Voivod0]

Всем спасибо) цикл действительно ненужен. Код вышел довольно простой но зато отлично работает.

var i=1;
function next(){
    ++i;
    var min = 1, max = 6;
    var rand = min - 0.5 + Math.random()*(max-min+1)
    rand = Math.round(rand);
    var z=document.getElementById(i);
    z.className="box-" +rand;
    z.style.zIndex=1+i;
    z=document.getElementById(i-1);
    z.style.opacity=0;
    
}