title: Trying to replace a word with the same word wrapped in a span element
body: <p>I have a <code>contenteditable div</code>. I am trying to hunt for the word "design" and wrap it in a <code>span</code> element.</p>
  
  <p><b>HTML</b>:</p>
  
  <pre><code>&lt;div id="text"&gt;&lt;/div&gt;
  </code></pre>
  
  <p><b>JavaScript:</b></p>
  
  <pre><code>$("#text").prop("contenteditable", true);
  var string = $("#text")[0].innerHTML;
  $("#text").innerHTML = string.replace("design", "&lt;span&gt;design&lt;/span&gt;");
  </code></pre>
  
  <p>This doesn't work. My first guess would be that its because the script runs once, so by the time I type "design" it doesn't catch it. So, I tried putting it in a <code>setInterval</code>, but that didn't work either. <a href="http://jsfiddle.net/7kqY3/" rel="nofollow"><b>JSFiddle</b></a></p>
  
  <p>Any help would be much appreciated.</p>