Size and color of text will change if we click on Set button because true value of setClass is assign to ng-class directive and text set to original size and color if we click on Reset button because false value of setClass variable assign to ng-class directive.

<!DOCTYPE html> <html xmlns=""> <head> <title>Welcome to LearnKode - A code learning platform</title> <script src=""></script> <style> .setClass { transition: all cubic-bezier(0.250, 0.460, 0.450, 0.940) 0.5s; color: red; font-size: 3em; } </style> </head> <body ng-app> <div> <div class="container"> <div class="well col-md-3"> <input type="button" ng-click="setClass=true" value="Set" /> <input type="button" ng-click="setClass=false" value="Reset" /> <br /> <h1 ng-class="{true:'setClass'}[setClass]">Sample Text</h1> </div> </div> </div> </body> </html>