javascript json getting data out, always say: "undefined" : <p>Hey guys I have a javascript file like this:</p>

<pre><code>  // An object that holds all images and words.
var items = {
    "images": [
        {
            "imageLink": "elephant.png",
            "imageText": "Elephant"
        },
        {
            "imageLink": "rabbit.jpeg",
            "imageText": "Rabbit"
        },
        {
            "imageLink": "tiger.jpg",
            "imageText": "Tiger"
        },
        {
            "imageLink": "turtle.png",
            "imageText": "Turtle"
        }

    ]
};

// Hide the buttons from the screen

var hidebuttons = function() {
    document.getElementById("buttonWrapper").classList.add("hide");
};

var replaceTitle = function(title) {
    document.getElementById("header").firstElementChild.innerHTML = title;
}

var rotateImage = function() {
    console.log(items.images.length);
    for (i = 0; i &lt; items.images.length; i++) {
        setInterval(function() {
          //  document.getElementById("imageToRotate").src= "img/" + items.images[i].imageLink;
            console.log(items.images);
            if (i === items.images.length -1) {
                i = 0;
            }
        }, 1000);

    }

}
</code></pre>

<p>and when I I use items.images it returns the follwoing in the console: </p>

<pre><code>Array[4]
0:    Object
1:    Object
      imageLink: "rabbit.jpeg"
      imageText: "Rabbit"
     __proto__: Object
</code></pre>

<p>but whenerver I use </p>

<pre><code>items.images[i] 
items.images.i
</code></pre>

<p>It always returns "undefined". Does anyone have an idea what I'm doing wrong? thanks for the help. Cheers!</p>
