This isn't jQuery-specific, but I'm building a jQuery plugin with an unusual requirement that has me pulling my hair out.
In a nutshell, multiple users are able to highlight text in their own "copy" of the document. For example, the saved markup for two users might look like: <div id="annotation_1"> The <span id="highlight_1">quick brown fox</span> jumps over the lazy dog. </div> and <div id="annotation_2"> The quick <span id="highlight_2">brown fox jumps</span> over the lazy dog. </div> These two annotated copies of the same content then need to be able to be rendered in a combined view. This would obviously be trivial if we didn't need to worry about overlapping span tags, but the plugin needs to be able to handle this scenario and herein lies my dilemma. My current thought is see if there is a plugin/method/technique to merge the two containers to create something like <div id="annotation_combined"> The <span id="highlight_1">quick </span><span id="highlight_1_2">brown fox</span> <span id="highlight_2">jumps</ span> over the lazy dog. </div> ... or similar that simulates overlapping markup capabilities. Any advice (or alternative methods) is appreciated. Thanks, Jason