Javascript for循环中未定义的图像数组

Question

在我的实验设计中，我使用z-index设计了4层div，其中第二层将在每次迭代中显示不同的图像。图像已使用类ID声明为数组。但是脚本中的超时功能无法识别数组，控制台表示数组是“未定义”。

有没有办法为setTimeout（）函数定义数组，就像以下代码中的div的getElementbyId（）一样？！

P.S：编码初学者。关于javascript的知识不多。感谢任何帮助，谢谢！

编辑：我仍然不清楚可用的答案。如果有人能提供更简单的方法，那将会很有帮助

<div id="crosshair" style="background-color:black; position:absolute; width:100%; height:100%; z-index:1; align:center">
   <img src="crosshair.jpg" width="1350px" height="750px" >
</div>

<div id="piclayer1" style="position:absolute ;width:98%; height:98%; z-index:2; align:center; margin-left:0.5%; margin-top:0.5%">
    <img id="images1" class="images" src="image1.jpg" style="width:1325px; height:720px; display:none">
    <img id="images2" class="images" src="image2.jpg" style="width:1325px; height:720px; display:none">
    <img id="images3" class="images" src="image3.jpg" style="width:1325px; height:720px; display:none">
</div>

<script>
    var Layer2Images = document.querySelectorAll("img.images");
</script>


<script>
    for (i=0; i<=40;i++)
     {
        if (i == Layer2Images.length) { //alert here later }
        else
        {
         var t = 3000;
         var add = 3000;        
         setTimeout (function()
                    { Layer2Images[i].style.display = 'block';}
                    ,t);

         setTimeout (function questime()
                    { document.getElementById('question1_1');
                      question1_1.style.display = 'block';}
                    ,t+add);

         }
      }

 </script>

 <div id="question1_1" class="ques1" style="z-index:3; position:absolute; display:none; margin-left: 180px">
    <fieldset name="field1_1" id="field1_1">
       <form name ="problem1_1" id="problem1_1"  >
        <b> Identify the problem shown in this image. </b>
        <br> 
        <br>
        <input type="text" name="answer1_1" id="answer1_1" maxlength="30" style="width: 400px">
        <br>
        <br>
        <input type="button" value="Submit" onclick="showdiv1()"  >
       </form>
    </fieldset>
 </div>

</script>
<script>
    function showdiv1()
    {
    document.getElementById('question1_2').style.display = "block";
    document.getElementById('question1_1').style.display = "none";
    }
</script>
<script>
    function hidediv1()
    {
    document.getElementById('piclayer1').style.display = 'none';
    document.getElementById('question1_1').style.display = "none";
    document.getElementById('question1_2').style.display = 'none';
    }
</script>