diff --git a/src/main.js b/src/main.js
index 5abe1ec80..e9e2b1788 100644
--- a/src/main.js
+++ b/src/main.js
@@ -1,5 +1,8 @@
 // query selector variables go here 👇
-
+var randomPosterButton = document.querySelector(".show-random");
+var image = document.querySelector(".poster-img");
+var title = document.querySelector(".poster-title");
+var quote = document.querySelector(".poster-quote");
 // we've provided you with some data to work with 👇
 var images = [
   "./assets/bees.jpg",
@@ -99,9 +102,11 @@ var quotes = [
   "A champion is defined not by their wins but by how they can recover when they fall."
 ];
 var savedPosters = [];
-var currentPoster;
+var currentPoster = document.querySelector(".poster");
 
 // event listeners go here 👇
+randomPosterButton.addEventListener('click', createRandomPoster);
+addEventListener("load", createRandomPoster);
 
 // functions and event handlers go here 👇
 // (we've provided two to get you started)!
@@ -110,9 +115,19 @@ function getRandomIndex(array) {
 }
 
 function createPoster(imageURL, title, quote) {
-  return {
+  var poster =  {
     id: Date.now(), 
     imageURL: imageURL, 
     title: title, 
-    quote: quote}
+    quote: quote
+  }
+  return poster
+}
+
+function createRandomPoster(){
+  newPoster = createPoster(images[getRandomIndex(images)], titles[getRandomIndex(titles)], quotes[getRandomIndex(quotes)]);
+  currentPoster.innerHTML = 
+  `<img class="poster-img" src="${newPoster.imageURL}" alt="nothin' to see here">
+  <h1 class="poster-title">"${newPoster.title}"</h1>
+  <h3 class="poster-quote">"${newPoster.quote}"</h3>`
 }
\ No newline at end of file