diff --git a/demo.js b/demo.js
index 7f85afb..e447297 100644
--- a/demo.js
+++ b/demo.js
@@ -7,6 +7,14 @@ angular.module('demoapp', ['ngMdIcons'])
         $scope.fill = colors[0];
         $scope.size = 48;
 
+        $scope.clickIcon = 'thumb_up';
+        $scope.clickIconMorph = function () {
+            if ($scope.clickIcon == 'thumb_up')
+                $scope.clickIcon = 'thumb_down';
+            else
+                $scope.clickIcon = 'thumb_up';
+        }
+
         setInterval(function() {
             var random = Math.random();
             if (random < 0.2) {
diff --git a/index.html b/index.html
index 3abe213..47cbdbd 100644
--- a/index.html
+++ b/index.html
@@ -109,6 +109,7 @@ <h1>Angular Material Icons v0.4.0</h1>
             <div><ng-md-icon icon="{{icon}}" ng-attr-style="fill: {{fill}}" size="48" options='{"duration": 375}'></ng-md-icon><br>options=<br>'{"duration": 375}'<br>(default is 750)</div>
             <div><ng-md-icon icon="{{icon}}" ng-attr-style="fill: {{fill}}" size="48" options='{"rotation": "none"}'></ng-md-icon><br>options=<br>'{"rotation": "none"}'<br>(default is clock)</div>
             <div><ng-md-icon icon="{{icon}}" ng-attr-style="fill: {{fill}}" size="48" options='{"rotation": "counterclock"}'></ng-md-icon><br>options=<br>'{"rotation": "counterclock"}'</div>
+            <div><ng-md-icon icon="{{clickIcon}}" ng-attr-style="fill: {{fill}}" size="48" options='{"duration": 375, "rotation": "none"}' ng-click="clickIconMorph()"></ng-md-icon><br>Example:<br>Morph on ng-click</div>
             <br>
             <br>Note that <code>options</code> attribute is a JSON parse-able string so surround keys with double-quotes.
         </li>