diff --git a/core/js/jquery.avatar.js b/core/js/jquery.avatar.js
index b44fe5fd631..0d4c063a91a 100644
--- a/core/js/jquery.avatar.js
+++ b/core/js/jquery.avatar.js
@@ -140,12 +140,13 @@
 
 			// If the new image loads successfully set it.
 			img.onload = function() {
-				$div.show();
 				$div.text('');
 				$div.append(img);
 				$div.clearimageplaceholder();
 			};
 
+			$div.addClass('icon-loading');
+			$div.show();
 			img.width = size;
 			img.height = size;
 			img.src = url;
diff --git a/core/js/placeholder.js b/core/js/placeholder.js
index f173e738676..5cf7b9095ad 100644
--- a/core/js/placeholder.js
+++ b/core/js/placeholder.js
@@ -2,7 +2,7 @@
  * ownCloud
  *
  * @author John Molakvoæ
- * @copyright 2016 John Molakvoæ <fremulon@protonmail.com>
+ * @copyright 2016-2017 John Molakvoæ <skjnldsv@protonmail.com>
  * @author Morris Jobke
  * @copyright 2013 Morris Jobke <morris.jobke@gmail.com>
  *
@@ -47,7 +47,7 @@
  * <div id="albumart" style="background-color: hsl(123, 90%, 65%); ... ">A</div>
  *
  */
- 
+
  /*
  * Alternatively, you can use the prototype function to convert your string to hsl colors:
  *
@@ -156,5 +156,6 @@
 		this.css('text-align', '');
 		this.css('line-height', '');
 		this.css('font-size', '');
+		this.removeClass('icon-loading');
 	};
 }(jQuery));