JSFiddle - React, Tailwind, and code Playground

by rwachtler

HTML

<div id="image-container"></div>

CSS

img{
    width: 200px;
    height: 200px;
}

JavaScript

$(document).ready(function () {
    var images = [{
        name: 1,
        result: 1,
        prefecture: "city",
        photo: "http://truestorieswithgill.com/wp-content/uploads/2013/09/20130915-190532.jpg"
    }, {
        name: 1,
        result: 1,
        prefecture: "city",
        photo: "http://truestorieswithgill.com/wp-content/uploads/2013/09/20130915-190532.jpg"
    }, {
        name: 1,
        result: 1,
        prefecture: "city",
        photo: "http://truestorieswithgill.com/wp-content/uploads/2013/09/20130915-190532.jpg"
    }, {
        name: 1,
        result: 1,
        prefecture: "city",
        photo: "http://truestorieswithgill.com/wp-content/uploads/2013/09/20130915-190532.jpg"
    }, {
        name: 1,
        result: 1,
        prefecture: "city",
        photo: "http://truestorieswithgill.com/wp-content/uploads/2013/09/20130915-190532.jpg"
    }, {
        name: 1,
        result: 1,
        prefecture: "city",
        photo: "http://truestorieswithgill.com/wp-content/uploads/2013/09/20130915-190532.jpg"
    }];
    
    var container = $('#image-container');
    for(var i = 0; i < images.length; i++){
    	var img = document.createElement('img');
        img.setAttribute("src",images[i].photo);
    	container.append(img);  
    }
});