Animating Text

HTML

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<div id="questions_menu_drawer">Animating Text</div>

CSS

.moz-trial{
   -moz-animation:moz-trial 2s;
   -webkit-animation: moz-trial 1s;
 }

 @-webkit-keyframes moz-trial {

 0%   {
  opacity: 0;
  -moz-transform: translateX(-20px);
  -webkit-transform: translateX(-20px);
}
50%   {
  opacity: 0.8;
  -moz-transform: translateX(+20px);
  -webkit-transform: translateX(+20px);
}
100%   {
  opacity: 1;
  -moz-transform: translateX(0px);
  -webkit-transform: translateX(0px);
}
}

JavaScript

$('#questions_menu_drawer').on('click',function(){    
   $(this).addClass('moz-trial');
});