CodePen

HTML

            
              <div id="main">

</div>

            
          
!
via HTML Inspector

CSS

            
              #main {
  width: 50%;
  height: 300px;
  margin: 0.3em 25%;
}

.one {
  background: url("http://sustainabuildingbelize.com/images/bgimages/1.jpg");
}

.two {   
  background: url("http://sustainabuildingbelize.com/images/bgimages/2.jpg");
}

.three {
 background: url("http://sustainabuildingbelize.com/images/bgimages/4.jpg") 
}

.four {
background: url('http://sustainabuildingbelize.com/images/bgimages/5.jpg');
}

            
          
!
? ?
? ?
Must be a valid URL.
+ add another resource
via CSS Lint

JS

            
              var num = (Math.floor(Math.random()*4));


var array = ['one', 'two', 'three', 'four'];

var elem = document.getElementById('main');

elem.classList.add(array[num]);

            
          
!
Must be a valid URL.
+ add another resource
via JS Hint
Loading ..................