title: CSS code to change icon image
body: <p>I have the code below set to the icon image for a navigation button.  How do I change this code when the button becomes active to insert another icon image?  I am using jquery mobile.  thanks</p>
  
  <pre><code>.nav-glyphish-example .ui-btn .ui-btn-inner {
   padding-top: 40px !important; 
  }
  .nav-glyphish-example .ui-btn .ui-icon { 
  width: 30px!important; 
  height: 30px!important; 
  margin-left: -15px !important; 
  box-shadow: none!important; 
  -moz-box-shadow: none!important;
  -webkit-box-shadow: none!important;
  -webkit-border-radius: 0 !important; border-radius: 0 !important; 
  }
  
  #home .ui-icon { 
  background:  url(glyphish/icons/icons-gray/983-calendarblue@2x.png) 50% 50% no-repeat; 
  background-size: 24px 22px; 
  }
  </code></pre>