jQuery .wrap issue

Question

How would I go about using the jQuery .wrap method to wrap a span around text in an element?

Here is the code I am working with so far:

$.each(childElements, function(i, val) {
            $(childElements[i]).wrap("<span class='' id='child_element_" + i + "' />");
        });

I want to wrap that span around the text that is in my childElements array (the childElements array contains tags such as <a>, <b> and <i>

Answer 1

You probably want to use wrapInner (If I understand what you want to do correctly).

$.each(childElements, function(i, val) {
   $(childElements[i]).wrapInner("<span class='' id='child_element_" + i + "' />");
});

It will create <span> elements and wrap them around the content of each of your childElements.

For example, <b>Foo</b> will become <b><span class='' id='child_element_0'>Foo</span></b>.