Display more than 1 more image
How can I get this code to display a second/third/fourth image within the same page?
I've added a second but it only shows a bordered box
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" name="viewport" content="width=device-width, initial-scale=1"/> <link rel="stylesheet" type="text/css" href="css/bootstrap.css"/> </head> <body> <nav class="navbar navbar-default"> </nav> <div class="col-md-6 well"> <hr style="border-top:1px dotted #ccc;"/> <img id="target" height="400px" width="600px"/> </div> </body> </html>
var images = [ 'image 1.jpg', 'image 2.jpg', 'image 3.jpg' ]; var length = images.length; var rand = Math.floor(length*Math.random()); document.getElementById('target').src="images/" + images[rand];