I have the following div:
<div contenteditable="true" unselectable="off" id="foo">
inside this div I want to make a specific amount of words look bold everytime a user makes an input. Therefor I have the following changelistener:
$('#foo').live('focus', function() {
before = $(this).html();
}).live('blur keyup paste', function() {
if (before != $(this).html()) { $(this).trigger('change'); }
});
$('#foo').live('change', function() {
// make certain words bold
document.execCommand ('bold', false, null); // doesn't work
});
I tried to use the document.execCommand() but it only works when I select the text which I want to make bold. But I don't want to select the text because the user doesn't know the words which should be bold.
You can not use execCommand to bold text without selecting it first.
I don't understand what are you doing exactly, but if you know the words you want to make bold, just replace them with <strong>your word</strong>
in the editors html, using js.