javascript - Wrap textNodes without separating on <br>? -

As part of the node & lt; Br> There is a way to wrap text nodes by including , each & lt; Br> Instead of dividing the nodes on, I can still prevent nodes from blocking elements like & lt; P & gt; ?

If I have any element

  & lt; Div id = test & gt; This & lt; Br> a sentence. & Lt; P & gt; This & lt; Br> . Another & lt; / P & gt; & Lt; / Div & gt;  

and I call

  $ ('# test'). material (). Filter (function () {return (this.nodeType == 3}}). Rap ('& lt; span & gt;');  

The result of

  
 gt; & Lt; Span & gt; This & lt; / Span & gt; & Lt; Br> & Lt; Period & gt; a sentence. & Lt; / Span & gt; & Lt; P & gt; & Lt; Span & gt; This is & lt; / Span & gt; & Lt; Br> & Lt; Span & gt; Another & lt; / Span & gt; & Lt; / P & gt; & Lt; / Div & gt;  

My desired result will be

  
 gt; & Lt; Span & gt; This & lt; Br> a sentence. & Lt; / Span & gt; & Lt; P & gt; This & lt; Br> . Another & lt; / P & gt; & Lt; / Div & gt;  

How can I get it?

There is a brute force here It encompasses every direct child of #test and collects the sequences of the text nodes + br tag and when the sequence is over, what has been stored so far in this interval.

  function wrapplanetextwithr (selector) {var cum = []; Function flush (pause) {if (cum.length) {var temp = document.createElement ("span"); $ (POS) before (temporary); Var span = $ ("& lt; span & gt;") Attachment (cum); $ (Temporary) .after (period); $ (Temporary) .remove (); Cum.length = 0; }} Var item = $ (selector) .contents (); Items.each (function (index, element) (if (this.nodeType === 3 || (this.nodeType === 1 & amp; amp; this.tagName === "BR")) {cum.push (This); // If we only process the final element, then flush it now (index === (item.length - 1)) {flush (it);}} and {// found a non-text node  

Work demo:

---

;);)

Edit: I realized this could be a little simplified using jQuery's . WrapAll) Live:

  Open function PlainTextWithBR (selector) {var cum = []; Function flush (pause) {if (cum.length) {$ (with). WrapAll ("& lt; span / & gt;"); Cum.length = 0; }} Var item = $ (selector) .contents (); Items.each (function (index, element) (if (this.nodeType === 3 || (this.nodeType === 1 & amp; amp; this.tagName === "BR")) {cum.push (This); // If we only process the final element, then flush it now (index === (item.length - 1)) {flush (it);}} and {// found a non-text node , Any flush (this);}});}  

working demo:

in non-br, co-list flush