title: How to change color when click icon in css
body: <p>I'm facing about the problem of change color when click on icon heart in css and jquery</p>
  
  <p>css:</p>
  
  <p>when not yet click icon</p>
  
  <pre><code>.iconHeartInactive::before {
     content: '\e841';
     color: rgba(71,78,82,.4);
   }
  </code></pre>
  
  <p>when clicked icon:</p>
  
  <pre><code>.iconHeartActive::after{
      content: '\e845';
      color: #ed1b77;
   }
  </code></pre>
  
  <p>HTML:</p>
  
  <pre><code>&lt;span&gt;
  &lt;button class="saveHome hoverPulse pan typeReversed"&gt;
      &lt;span class="stackIcons"&gt;
          &lt;i class="iconHeartActive iconOnly"&gt;&lt;/i&gt;
          &lt;i class="iconHeartEmpty typeReversed iconOnly"&gt;&lt;/i&gt;
      &lt;/span&gt;
  &lt;/button&gt;
  &lt;/span&gt; 
  &lt;script&gt;
     $( "iconHeartInactive" ).click(function() {
     $( this ).toggleClass( "iconHeartActive" );
   });
   &lt;/script&gt;
  </code></pre>
  
  <p>How can I click on icon and it change color? thank so much !</p>