title: Replace specific word in contenteditable
body: <p>I have a contenteditable div </p>
  
  <pre><code>&lt;div id="divTest" contenteditable="true"&gt;
  </code></pre>
  
  <p>I need to get the last word from caret position and on certain condition I have to test and remove this specific word only. Below is how am I doing</p>
  
  <pre><code>$('#divTest').on('keyup focus', function (e) {
             if (e.keyCode == 32) {
                 var lastWord = getWordPrecedingCaret(this),                                       spanLastWord = $('#lastWord');
  
             }
         });
  
  function getWordPrecedingCaret(containerEl) {
                 var preceding = "",
                                      sel,
                                      range,
                                      precedingRange;
                 if (window.getSelection) {
                     sel = window.getSelection();
                     if (sel.rangeCount &gt; 0) {
                         range = sel.getRangeAt(0).cloneRange();
                         range.collapse(true);
                         range.setStart(containerEl, 0);
                         preceding = range.toString();
  
  
                     }
                 } else if ((sel = document.selection) &amp;&amp; sel.type != "Control") {
                     range = sel.createRange();
                     precedingRange = range.duplicate();
                     precedingRange.moveToElementText(containerEl);
                     precedingRange.setEndPoint("EndToStart", range);
                     preceding = precedingRange.text;
                 }
  
                 var words = range.toString().trim().split(' '),
                          lastWord = words[words.length - 1];
                    if (lastWord) {
  
                     var resultValue = 'some'; // this value is coming from some other function
                     if (resultValue == lastWord) {
                       alert('do nothing');
                         // do nothing
                     }
                   else
                     {
                       alert('replace word');
                       // delete That specific word and replace if with resultValue
                     }
                     return lastWord;
  
                 }
             }
  </code></pre>
  
  <p>Demo: <a href="http://codepen.io/anon/pen/ogzpXV" rel="noreferrer">http://codepen.io/anon/pen/ogzpXV</a> </p>
  
  <p>I have tried range.deleteContents(); but that will delete all the content in the div.
  How can I replace specific word only?</p>