title: HTML entity inside of jQuery html()
body: <p>I have a hidden div and a link to toggle the div's visibility. The link contains text/html that needs to also toggle ('hide'/'show'). Here is my function:</p>
  
  <pre><code>jQuery('#toggle_filter_link').click(function() {
      jQuery('#searchfilter_wrap').slideToggle("slow");
      jQuery(this).html(jQuery(this).text() == 'Hide &amp;uarr;' ? 'Show &amp;darr;' : 'Hide &amp;uarr;');
  });
  </code></pre>
  
  <p>This function works as intended until I add the arrows to the HTML (<code>&amp;uarr;</code> and <code>&amp;darr;</code>), at which point it toggles to "Hide &uarr;" the first time, and then remains stuck.</p>
  
  <p>Here a <strong><a href="http://jsfiddle.net/8dvNW/" rel="nofollow">jsFiddle</a></strong>.</p>
  
  <p>I assume that I need to escape the HTML Entities somehow, but considering that the first switch works I am a bit confused. It's probably something obvious that I'm missing though. :-)</p>
  
  <p>Thanks for the help!</p>