diff --git a/public/src/forum/recent.js b/public/src/forum/recent.js
index 8186a69e59..50e53792a9 100644
--- a/public/src/forum/recent.js
+++ b/public/src/forum/recent.js
@@ -34,7 +34,7 @@ define(function() {
 		});
 
 		$('#new-topics-alert').on('click', function() {
-			$(this).hide();
+			$(this).addClass('hide');
 		});
 
 		socket.on('event:new_topic', function(data) {
@@ -77,7 +77,7 @@ define(function() {
 
 		text += ' Click here to reload.';
 
-		$('#new-topics-alert').html(text).fadeIn('slow');
+		$('#new-topics-alert').html(text).removeClass('hide').fadeIn('slow');
 	}
 
 	Recent.onTopicsLoaded = function(topics) {
diff --git a/public/src/forum/unread.js b/public/src/forum/unread.js
index 329cfff3ff..13a940a91f 100644
--- a/public/src/forum/unread.js
+++ b/public/src/forum/unread.js
@@ -15,7 +15,7 @@ define(function() {
 			newPostCount = 0;
 
 		$('#new-topics-alert').on('click', function() {
-			$(this).hide();
+			$(this).addClass('hide');
 		});
 
 		socket.on('event:new_topic', function(data) {
@@ -44,7 +44,7 @@ define(function() {
 
 			text += ' Click here to reload.';
 
-			$('#new-topics-alert').html(text).fadeIn('slow');
+			$('#new-topics-alert').html(text).removeClass('hide').fadeIn('slow');
 		}
 
 		socket.on('event:new_post', function(data) {
diff --git a/public/templates/recent.tpl b/public/templates/recent.tpl
index 80c6904401..97a2c062dc 100644
--- a/public/templates/recent.tpl
+++ b/public/templates/recent.tpl
@@ -13,7 +13,7 @@
 <br />
 
 <a href="/recent">
-	<div class="alert hide" id="new-topics-alert"></div>
+	<div class="alert alert-warning hide" id="new-topics-alert"></div>
 </a>
 
 <div class="alert alert-warning hide {no_topics_message}" id="category-no-topics">
diff --git a/public/templates/unread.tpl b/public/templates/unread.tpl
index 6d1ec7dcca..0f3b92bb2a 100644
--- a/public/templates/unread.tpl
+++ b/public/templates/unread.tpl
@@ -5,16 +5,16 @@
 		<div id="category_active_users"></div>
 	</ol>
 
-	<a href="/unread">
-		<div class="alert hide" id="new-topics-alert"></div>
-	</a>
-
 	<div class="alert alert-warning {no_topics_message}" id="category-no-topics">
 		<strong>[[unread:no_unread_topics]]</strong>
 	</div>
 
 	<button id="mark-allread-btn" class="btn btn-primary {show_markallread_button}">[[unread:mark_all_read]]</button>
 
+	<a href="/unread">
+		<div class="alert alert-warning hide" id="new-topics-alert"></div>
+	</a>
+
 	<div class="category row">
 		<div class="{topic_row_size}">
 			<ul id="topics-container" data-next-start="{nextStart}">