WYSIWYG again, IE simplest execCommand

Question

I wrote the simplest WYSIWYG in js/jquery: http://jsfiddle.net/XnSWF/

Works perfectly (eg. set to write in bold or set bold on selected text) on newset Opera 11, Chrome 16, Firefox 9 and Safari 5.1 but in IE9 I can't set bold to selected text and always when i use bold button, this carret go to first line to first letter...

Why?

Answer 1

It's because the selection is destroyed before the click event fires in IE. You can get round this by using the the mousedown event instead, or (better) by making the button text unselectable:

$('<li class="wysiwyg-bold"><b unselectable="on">textBold</b></li>')
    .appendTo('.wysiwyg-toolbar');

Live demo: http://jsfiddle.net/XnSWF/1/