How can i show images in grid

1

Screenshot%20(4)

Screenshot%20(5)
Screenshot%20(5)614×524 57.2 KB

var table = [];
var rows = 10;
var cols = 10;
for(var i = 0; i < rows; i++){
   table[i]=[];
}
document.write('<div class="main">');
for(var i = 0; i < rows; i++){
   for(var j = 0; j < cols; j++){
document.write(table[i],"<img src='" + myImage[i].image + "' width='50' height='50'/>");
//document.write('<div class="div_cell">'+ i +" "+ j+"|"+ '</div>');
   }
}
document.write('</div>');
var imageArray = [
 {  image: 'img/img1.jpg' }, 
 {  image: 'img/img2.jpg' }, 
 {  image: 'img/img3.jpg' }
];
for (var i = 0; i < imageArray.length; i++) {
   var myImage = imageArray;
   document.write("<img src='" + myImage[i].image + "' width='50' height='50'/>");
   
}

<!DOCTYPE html>
<html>
  <head>
    <title> turn-based board game in JavaScript
    </title>
    <link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css" rel="stylesheet">
    <link rel="stylesheet" type="text/css" href="css/style.css">
    <script type="text/javascript" src="js/j-query.js."></script>
    <script type="text/javascript" src="js/script.js"></script>
  </head>
  <body>
  
    <img src=" " id="myImage">
      
    
  </body>
</html>
2

Try setting the background to an image in the grid cell? Not the best with JavaScript, so that may not work.