Dynamically populating pictures in table via loop and mysql database

Dynamically populating pictures in table via loop and mysql database

I have a database that has a news  table, the 5th field technically data[4], since it starts at the id field as data[0], is a text field, with the name of my pic.  Here is the code below:

for(var i = 0; i < data.length; i++) {
     $('#output').append("<table width=100% bgcolor=white><tr><td width=10% class=white><img src='images/"+data[i][4]+".png'></td><td width=80% class=blue>"+data[i][2]+"</td><td width=10% class=yellow>"+data[i][1]+"</td></tr><tr><td width=100% colspan=3 class=green>"+data[i][3]+"</td></tr></table><br>");     
    }

Unfortunately, the result of this code, is that it loops all the other fields and populates the table as it should BUT, my highlighted code for the pictures does not work properly...every other feild populates, but the <img src='images/"+data[i][4]+".png'> only populates the picture for the first record... in the table...hope that makes sense. 

Any help is much appreciated.