In my project, I am trying to set the caret position always to the end of the text. I know this is default behaviour but when we add some text dynamically, then the caret position changes to starting point in Chrome and firefox (IE is fine, amazing).

Anyway to make it to work properly in chrome and firefox?

Here is the fiddle

<div id=result contenteditable=true></div>

<button class=click>click to add text</butto>

var result = $('#result');

$('.click').click(function () {

    var preHtml = result.html();

    result.html(preHtml + hello);

    result.focus();

});

I tried adding setStart and setEnd as mentioned in this link but no use.