How to get startOffset/endOffset of selected html text?
<p>I'm trying to wrap selected text from a "contenteditable" div in a given tag. Below seems to be working ok but startOffset/endOffset doesn't include HTML text. My question is how do I get the Range object to count the html tags if they exist in the selection?</p>

<pre><code>getSelectedText: function() {
  var range;
  if (window.getSelection) {
    range = window.getSelection().getRangeAt(0);
    return [range.startOffset, range.endOffset];
  }
}


toggleTagOnRange: function(range, tag, closeTag) {
  var removeExp, val;
  if (closeTag == null) {
    closeTag = tag;
  }
  val = this.get("value");
  removeExp = RegExp("&lt;" + tag + "&gt;(.+)&lt;/" + closeTag + "&gt;");
  if (removeExp.test(val)) {
    this.set("value", val.replace(removeExp, function(match, $1) {
      return $1;
    }));
  } else {
    if (range.length &gt; 1) {
      val = val.splice(range[1], "&lt;/" + closeTag + "&gt;").splice(range[0], "&lt;" + tag + "&gt;");
      this.set("value", val);
    }
  }
  return this.get("val");
}

// this is called from a bold button click handler.
this.toggleTagOnSelection(this.getSelectedText(), 'strong');
</code></pre>

<p>Interested in other solutions if you've got them. </p>
