diff --git a/djangoproject/scss/_style.scss b/djangoproject/scss/_style.scss
index 4fcccf526..48b436a08 100644
--- a/djangoproject/scss/_style.scss
+++ b/djangoproject/scss/_style.scss
@@ -3427,6 +3427,11 @@ ul.corporate-members li {
             margin-right: 10px;
         }
 
+        &.fade-out {
+            opacity: 0;
+            transition: opacity 400ms;
+        }
+
         &.info {
             &::before {
                 content: $fa-var-info-circle;
diff --git a/djangoproject/static/js/djangoproject.js b/djangoproject/static/js/djangoproject.js
index f6e9229eb..725c3851c 100644
--- a/djangoproject/static/js/djangoproject.js
+++ b/djangoproject/static/js/djangoproject.js
@@ -11,3 +11,14 @@ document.querySelectorAll('#doc-versions a').forEach(function (el) {
     this.href = this.href.split('#')[0] + window.location.hash;
   });
 });
+
+// Fade out and remove message elements when close icon is clicked
+document.querySelectorAll('.messages li .close').forEach(function (el) {
+  el.addEventListener('click', function (e) {
+    this.parentElement.addEventListener('transitionend', function (e) {
+      this.style.display = 'none';
+    });
+
+    this.parentElement.classList.add('fade-out');
+  });
+});
diff --git a/djangoproject/static/js/main.js b/djangoproject/static/js/main.js
index a51dcd812..8e7c84be2 100644
--- a/djangoproject/static/js/main.js
+++ b/djangoproject/static/js/main.js
@@ -57,10 +57,6 @@ define(function () {
     mods.push('mod/corporate-member-join');
   }
 
-  if (hasClass('messages')) {
-    mods.push('mod/messages');
-  }
-
   if (hasClass('code-block-caption') || hasClass('snippet')) {
     mods.push('mod/clippify');
   }
diff --git a/djangoproject/static/js/mod/messages.js b/djangoproject/static/js/mod/messages.js
deleted file mode 100644
index c6728d5e0..000000000
--- a/djangoproject/static/js/mod/messages.js
+++ /dev/null
@@ -1,7 +0,0 @@
-define([
-  'jquery', //requires jquery
-], function ($) {
-  $('.messages li').on('click', '.close', function () {
-    $(this).parents('.messages > li').fadeOut();
-  });
-});