Why doesn't the document.execCommand work when I click on a div?

Question

Both the button and the div have the same 'onclick' code, yet the execCommand only seems to work on the button. Is there any way I can make it work when pressing the div?

Here's my fiddle: http://jsfiddle.net/foreyez/ZzL8y/

<button onclick="document.execCommand('bold',false,null);">Bold</button>
<div onclick="document.execCommand('bold',false,null);" style='border:1px solid black;width:50px;'>Bold</div>

<div id='input' contenteditable='true'>
    select some of this text and then hit one of the buttons above
</div>

​

Answer 1

You need to prevent the mousedown event on your div because it steals the focus:

Updated fiddle