title: How to override css cursor property of a hovered button?
body: <p>I have a <code>&lt;button&gt;</code>, when the user hover it, the cursor become pointer (via CSS).</p>
  
  <p>When the user click on the <code>&lt;button&gt;</code>, the cursor of all the page should become <code>wait</code> (via jQuery).</p>
  
  <p>However, if the user keeps the cursor inside <code>&lt;button&gt;</code>, it will stay as <code>pointer</code>. How can I fix this ?</p>
  
  <p>Live example : <a href="http://jsfiddle.net/URuLa/" rel="nofollow">http://jsfiddle.net/URuLa/</a></p>
  
  <p>Tested with Chrome 36.0.1985.125 (last version)</p>