Replace selected text with jquery/javascript

Question

I am trying to build a specialized WYSIWYG text editor in the browser, and have a very limited set of functionality, but the biggest part of that is wrapping certain text in span tags.

I can find many resources explaining standard stuff (execCommand and whatnot), but have looked and looked and can't find anything to do what I need.

Basically, it's as simple as it sounds: user selects some text, clicks a button or whatever, and the text gets replaced with some other text (the initial case is that same text wrapped in some HTML tags).

I can find ways to do this in a textarea, but I'm just in regular HTML land, with the content in question inside a div with contentEditable marked as true.

I have also found ways to replace all occurences of text, or the first occurence, but not a specific one. Most solutions I find fail when trying to replace anything but the first occurence.

I'm hoping jQuery can do this in some way.

Answer 1

Have you tried the jQuery wrapSelection plugin?

Answer 2

This is pretty similar to this question. It might help.