title: Show a "Finger" on <li> hover like its an <a>
body: <p>i have a realy stupid problem -.-
  following:</p>
  
  <pre><code>&lt;ul id="selectable" data-bind="foreach: folders"&gt;
    &lt;li&gt;
      &lt;a href="#" data-bind=" text: $data, click: $root.goToFolder"&gt;&lt;/a&gt;
    &lt;/li&gt;
  &lt;/ul&gt;
  </code></pre>
  
  <p>its <a href="http://knockoutjs.com" rel="nofollow">KnockoutJS</a> combined with a bit of <a href="http://sammyjs.org" rel="nofollow">SammyJS</a>...
  atm you see i got a 'a' inside of the 'li'... so that there will appear this "finger" on the mousehover... but if i remove the 'a', ofc the "finger" wont be shown. instead it will appear this (lets call it) text-editor cursor... but its not obviously to the user that he is able to klick this element... is there a way to show this "finger" like on a link hover? </p>
  
  <p>in <a href="http://learn.knockoutjs.com/#/?tutorial=webmail" rel="nofollow">this</a> example they have also </p>
  
  <pre><code>&lt;ul&gt;&lt;li&gt;Item&lt;/li&gt;&lt;/ul&gt;
  </code></pre>
  
  <p>and it shows this "finger"</p>