diff --git a/src/components/cardbuilder/cardBuilder.js b/src/components/cardbuilder/cardBuilder.js
index 6cdbf55149..7f562f1fd0 100644
--- a/src/components/cardbuilder/cardBuilder.js
+++ b/src/components/cardbuilder/cardBuilder.js
@@ -1506,7 +1506,7 @@ define(['datetime', 'imageLoader', 'connectionManager', 'itemHelper', 'focusMana
 
         function getDefaultText(item, options) {
             if (item.CollectionType) {
-                return '<i class="cardImageIcon material-icons">' + imageHelper.getLibraryIcon(item.CollectionType) + '</i>'
+                return '<i class="cardImageIcon material-icons ' + imageHelper.getLibraryIcon(item.CollectionType) + '"></i>'
             }
 
             switch (item.Type) {
diff --git a/src/components/homesections/homesections.js b/src/components/homesections/homesections.js
index 430c06bc57..b024528549 100644
--- a/src/components/homesections/homesections.js
+++ b/src/components/homesections/homesections.js
@@ -183,7 +183,7 @@ define(['connectionManager', 'cardBuilder', 'appSettings', 'dom', 'apphost', 'la
         for (var i = 0, length = items.length; i < length; i++) {
             var item = items[i];
             var icon = imageHelper.getLibraryIcon(item.CollectionType);
-            html += '<a is="emby-linkbutton" href="' + appRouter.getRouteUrl(item) + '" class="raised homeLibraryButton"><i class="material-icons homeLibraryIcon">' + icon + '</i><span class="homeLibraryText">' + item.Name + '</span></a>';
+            html += '<a is="emby-linkbutton" href="' + appRouter.getRouteUrl(item) + '" class="raised homeLibraryButton"><i class="material-icons homeLibraryIcon ' + icon + '"></i><span class="homeLibraryText">' + item.Name + '</span></a>';
         }
 
         html += '</div>';
diff --git a/src/components/slideshow/slideshow.js b/src/components/slideshow/slideshow.js
index 40d87e9519..4d426f2484 100644
--- a/src/components/slideshow/slideshow.js
+++ b/src/components/slideshow/slideshow.js
@@ -70,7 +70,7 @@ define(['dialogHelper', 'inputManager', 'connectionManager', 'layoutManager', 'f
 
         var tabIndex = canFocus ? '' : ' tabindex="-1"';
         autoFocus = autoFocus ? ' autofocus' : '';
-        return '<button is="paper-icon-button-light" class="autoSize ' + cssClass + '"' + tabIndex + autoFocus + '><i class="material-icons slideshowButtonIcon">' + icon + '</i></button>';
+        return '<button is="paper-icon-button-light" class="autoSize ' + cssClass + '"' + tabIndex + autoFocus + '><i class="material-icons slideshowButtonIcon ' + icon + '"></i></button>';
     }
 
     function setUserScalable(scalable) {
@@ -201,14 +201,16 @@ define(['dialogHelper', 'inputManager', 'connectionManager', 'layoutManager', 'f
         function onAutoplayStart() {
             var btnSlideshowPause = dlg.querySelector('.btnSlideshowPause i');
             if (btnSlideshowPause) {
-                btnSlideshowPause.innerHTML = "pause";
+                btnSlideshowPause.classList.remove("play_arrow");
+                btnSlideshowPause.classList.add("pause");
             }
         }
 
         function onAutoplayStop() {
             var btnSlideshowPause = dlg.querySelector('.btnSlideshowPause i');
             if (btnSlideshowPause) {
-                btnSlideshowPause.innerHTML = "&#xE037;";
+                btnSlideshowPause.classList.remove("pause");
+                btnSlideshowPause.classList.add("play_arrow");
             }
         }
 
@@ -365,8 +367,7 @@ define(['dialogHelper', 'inputManager', 'connectionManager', 'layoutManager', 'f
         }
 
         function playPause() {
-
-            var paused = dlg.querySelector('.btnSlideshowPause i').innerHTML !== "pause";
+            var paused = !dlg.querySelector('.btnSlideshowPause i').classList.contains("pause");
             if (paused) {
                 play();
             } else {
diff --git a/src/controllers/dashboard/scheduledtasks/scheduledtasks.js b/src/controllers/dashboard/scheduledtasks/scheduledtasks.js
index 2c665a4403..390fd17353 100644
--- a/src/controllers/dashboard/scheduledtasks/scheduledtasks.js
+++ b/src/controllers/dashboard/scheduledtasks/scheduledtasks.js
@@ -49,7 +49,7 @@ define(["jQuery", "loading", "events", "globalize", "serverNotifications", "huma
             html += "</a>";
             html += "</div>";
             if (task.State === "Running") {
-                html += '<button type="button" is="paper-icon-button-light" id="btnTask' + task.Id + '" class="btnStopTask" data-taskid="' + task.Id + '" title="' + globalize.translate("ButtonStop") + '"><i class="material-icons">stop</i></button>';
+                html += '<button type="button" is="paper-icon-button-light" id="btnTask' + task.Id + '" class="btnStopTask" data-taskid="' + task.Id + '" title="' + globalize.translate("ButtonStop") + '"><i class="material-icons stop"></i></button>';
             } else if (task.State === "Idle") {
                 html += '<button type="button" is="paper-icon-button-light" id="btnTask' + task.Id + '" class="btnStartTask" data-taskid="' + task.Id + '" title="' + globalize.translate("ButtonStart") + '"><i class="material-icons play_arrow"></i></button>';
             }
@@ -90,16 +90,22 @@ define(["jQuery", "loading", "events", "globalize", "serverNotifications", "huma
         return html;
     }
 
+    function setTaskButtonIcon(button, icon) {
+        var inner = button.querySelector("i");
+        inner.classList.remove("stop", "play_arrow");
+        inner.classList.add(icon);
+    }
+
     function updateTaskButton(elem, state) {
         if (state === "Running") {
             elem.classList.remove("btnStartTask");
             elem.classList.add("btnStopTask");
-            elem.querySelector("i").innerHTML = "stop";
+            setTaskButtonIcon(elem, "stop");
             elem.title = globalize.translate("ButtonStop");
         } else if (state === "Idle") {
             elem.classList.add("btnStartTask");
             elem.classList.remove("btnStopTask");
-            elem.querySelector("i").innerHTML = "&#xE037;";
+            setTaskButtonIcon(elem, "play_arrow");
             elem.title = globalize.translate("ButtonStart");
         }
         $(elem).parents(".listItem")[0].setAttribute("data-status", state);
diff --git a/src/elements/emby-collapse/emby-collapse.js b/src/elements/emby-collapse/emby-collapse.js
index 600af55516..fdd77adf0b 100644
--- a/src/elements/emby-collapse/emby-collapse.js
+++ b/src/elements/emby-collapse/emby-collapse.js
@@ -80,7 +80,7 @@ define(['browser', 'css!./emby-collapse', 'registerElement', 'emby-button'], fun
 
         var title = this.getAttribute('title');
 
-        var html = '<button is="emby-button" type="button" on-click="toggleExpand" id="expandButton" class="emby-collapsible-button iconRight"><h3 class="emby-collapsible-title" title="' + title + '">' + title + '</h3><i class="material-icons emby-collapse-expandIcon">expand_more</i></button>';
+        var html = '<button is="emby-button" type="button" on-click="toggleExpand" id="expandButton" class="emby-collapsible-button iconRight"><h3 class="emby-collapsible-title" title="' + title + '">' + title + '</h3><i class="material-icons emby-collapse-expandIcon expand_more"></i></button>';
 
         this.insertAdjacentHTML('afterbegin', html);