title: Change font icon color inside button on hover
body: <p>In the footer of my site (in development) <a href="http://www.stefaanoyen.be" rel="nofollow">http://www.stefaanoyen.be</a>, there are 3 buttons with an arrow before the text. The arrow is an icon font, and I want it to change color (as does the button text) when the button is hovered.</p>
  
  <p>Any idea how to do this?</p>
  
  <p><strong>This is my html:</strong></p>
  
  <pre><code>&lt;a class="footerbutton"&gt;&lt;span class="footerlist"&gt;X&lt;/span&gt;Vraag offerte&lt;/a&gt;
  </code></pre>
  
  <p><strong>This is the button:hover css:</strong></p>
  
  <pre><code>a:hover.footerbutton {
  background-color: #B61618;
  color: #ddd;
  border: none;
  text-decoration: none;
  }
  </code></pre>
  
  <p><strong>And this is the footerlist span class css:</strong></p>
  
  <pre><code>.footerlist:hover {
  color: #ddd;
   }
  </code></pre>