diff --git a/src/main.js b/src/main.js
index c2bb920c..157b70d4 100644
--- a/src/main.js
+++ b/src/main.js
@@ -52,6 +52,8 @@ createNewBookButton.addEventListener("click", createNewBook);
 
 saveCoverButton.addEventListener("click", saveCover);
 
+savedCoversLayout.addEventListener("dblclick", deleteCover);
+
 // ========== Create your event handlers and other functions here 👇 ==========
 
 // ================== RANDOM COVER AND PAGE RELOAD ==================
@@ -135,7 +137,7 @@ function buildSavedCoversString() {
   // console.log(savedCovers[0].coverImg);
   var htmlSavedCoversString = "";
   for (let i = 0; i < savedCovers.length; i++) {
-    htmlSavedCoversString += `<section class="main-cover"> \
+    htmlSavedCoversString += `<section class="mini-cover" id="${savedCovers[i].id}"> \
     <img class="cover-image" src=${savedCovers[i].coverImg}> \
     <h2 class="cover-title">${savedCovers[i].title}</h2> \
     <h3 class="tagline">A tale of <span class="tagline-1">${savedCovers[i].tagline1}</span> and <span class="tagline-2">${savedCovers[i].tagline2}</span></h3> \
@@ -150,7 +152,6 @@ function buildSavedCoversString() {
     // <img class="overlay" src="./assets/overlay.png"> \
     // </section>`;
   }
-  console.log(htmlSavedCoversString);
   return htmlSavedCoversString;
 }
 
@@ -209,6 +210,17 @@ function viewHomePage() {
   formView.classList.toggle("hidden", true);
 }
 
+function deleteCover(event) {
+  var targetCover = event.target.parentNode;
+  for (i = 0; i < savedCovers.length; i++) {
+    if (savedCovers[i].id.toString() === targetCover.id) {
+      var index = i;
+    }
+  }
+  savedCovers.splice(index, 1);
+  viewSavedCovers();
+}
+
 // We've provided two functions to get you started
 function getRandomIndex(array) {
   return Math.floor(Math.random() * array.length);