How to display images using a function?
<p>I want to display some images (*.jpg) which I've stored in a folder. I want to display these images using a function. To do this I've created an array which consists of objects, and each object contains an id which I'm using in the function. Here's the code:   </p>

<pre><code>//employee array
var employees =[{
    name:"jacob",
    age :23,
    city:"Boston",
    yoe :12,
    image :'d.jpg',
    id : 1
    },
    {
    name:"aaron",
    age :21,
    city:"Nevada",
    yoe :12,
    image :'b.jpg',
    id : 2
    },
    ...   
}];
</code></pre>

<p>I'm using the employee <code>id</code> - which is the name of the image - to display the images. Below is the function for the images:</p>

<pre><code>function getimages(){
    for(var i = 1;i &lt;= employees.length;i++){
        document.getElementById("list + i").innerHTML = employees[i].id+".jpg";
    }
}
getimages(); // to get the images
</code></pre>

<p>This is the HTML part where I want to show these images:</p>

<pre><code>&lt;ul&gt;
    &lt;li id="list1"&gt;A&lt;/li&gt;
    &lt;li id="list2"&gt;B&lt;/li&gt;
    &lt;li id="list3"&gt;C&lt;/li&gt;
    &lt;p&gt;123213&lt;/p&gt;
&lt;/ul&gt;
</code></pre>
