diff --git a/list.php b/list.php
index b62ff6a7..f6950621 100644
--- a/list.php
+++ b/list.php
@@ -34,13 +34,16 @@ $token = $_SESSION['token'];
 </div>
 
 <!-- Alerts -->
-<div id="alInfo" class="alert alert-info" role="alert" hidden="true">
+<div id="alInfo" class="alert alert-info alert-dismissible fade in" role="alert" hidden="true">
+    <button type="button" class="close" data-hide="alert" aria-label="Close"><span aria-hidden="true">&times;</span></button>
     Adding to the <?php getFullName(); ?>...
 </div>
-<div id="alSuccess" class="alert alert-success" role="alert" hidden="true">
+<div id="alSuccess" class="alert alert-success alert-dismissible fade in" role="alert" hidden="true">
+    <button type="button" class="close" data-hide="alert" aria-label="Close"><span aria-hidden="true">&times;</span></button>
     Success! The list will refresh.
 </div>
-<div id="alFailure" class="alert alert-danger" role="alert" hidden="true">
+<div id="alFailure" class="alert alert-danger alert-dismissible fade in" role="alert" hidden="true">
+    <button type="button" class="close" data-hide="alert" aria-label="Close"><span aria-hidden="true">&times;</span></button>
     Failure! Something went wrong.
 </div>
 
@@ -60,6 +63,11 @@ require "footer.php";
             add();
         }
     });
+    $(function(){
+        $("[data-hide]").on("click", function(){
+            $(this).closest("." + $(this).attr("data-hide")).hide();
+        });
+    });
     
     function refresh() {
         $.ajax({