jQuery: How do I select text in a div and add tags around it?

Question

Hello everyone, I'm new to jQuery and I'm trying to do the following:

<div class="test">text</div>

I'm trying to write jQuery that will select the text inside the div and change it to:

<div class="test"><span>test</span></div>

When I try this in jQuery:

$(".test").prepend("<span>");
$(".test").append("</span>");

It shows up in the HTML as:

<div class="test"><span/>test</div>

Can anyone tell me what I'm doing wrong, and what I can do to fix it? Thanks!

Answer 1

Try the wrapInner function.

$(".test").wrapInner("<span></span>");