Sorry, but your code doesn't really make any sense. There are lots of things wrong with it:
Here's what you started with:
for (i = 0; i <= 11; i++) {
var img = new Image();
img.src = 'http://imagecache.arnoldclark.com/imageserver/" + obfuscatedString + "/" + camera[i] + "';
var row = "<div class='row'><div class='col-md-2'> + img[0] +</div></div>";
document.body.appendChild(row);
}
Issues:
- You create an
<img> DOM object, but don't do anything with it.
- You need to pass a DOM object to
appendChild() NOT pass a string.
- You can't construct a string of HTML by adding
img[0] into the string. It simply doesn't work that way at all. You either work entirely in HTML strings or you work in constructed HTML objects or you create an HTML object and then set .innerHTML to a string of HTML. You can't just mix the two the way you are.
I'll take a guess at what you want to do:
for (i = 0; i <= 11; i++) {
var src = "http://imagecache.arnoldclark.com/imageserver/" + obfuscatedString + "/" + camera[i];
var row = document.createElement("div");
row.className = 'row';
row.innerHTML = "<div class='col-md-2'><img src='" + src + "'></div>";
document.body.appendChild(row);
}
This code take the following steps:
- Calculate the image src URL.
- Create your container div DOM object.
- Set the desired className on the container object.
- Set the
.innerHTML property of the container to the HTML string for the HTML that you want in the container (this will automatically create that set of DOM objects in the container).
- Append the container to your document.
camera[i]without making sure it is valid, but you might have it hardcoded above.appendChildexpects a DOM element, not a string.