how do i loop an image to the full width/height of the page

Question

I am trying to loop a small image to 100% width of the page using a for loop.

var gameW = window.innerWidth;
var gameH = window.innerHeight;
var grass = document.getElementById("grass");
var sand = document.getElementById("sand");

grass.src = "images/grass.png"

function makeMap(){
    for(var i = 0; i < gameW; i++){
         grass++;
    }
}makeMap();

Answer 1

You can do this with css (if that is an option). background-repeat will probably do the job.

For example, you can add a single div that has the width of your viewport and set its background to the image you want.