Question

I have this code:

<p>Hi. I am your friend. you are my friend.<br> we <a href="both.html">both</a> are friends.</p>

My aim is to enclose the text before the anchor tag as well as after the anchor tag into separate spans. Thus, i want something like this in the DOM:

<p><span>Hi. I am your friend. you are my friend.<br> we </span><a href="both.html">both</a><span> are friends.</span></p>

Can anybody please help me and tell me how to do it in jQuery?

Answer 1

From this answer, you should be able to do something like the following:

$("p").contents().filter(function() {
    return this.nodeType == Node.TEXT_NODE;
}).wrap("<span/>");