Charles Yeung
Charles Yeung

Reputation: 38803

jQuery - Wrap div to a specific element

<div id="last"></div>
<p id="text">text</p>
<a id="link" href="xxx">link</a>

Suppose I have the code above, how can I wrap a <div></div> to the a element, and insert it after div element, the result should be:

<div id="last"></div>
<div><a id="link" href="xxx">link</a></div>
<p id="text">text</p>

Tried the code below, but not works

<!DOCTYPE html>
<html>
<head>
  <script src="http://code.jquery.com/jquery-1.4.4.js"></script>
</head>
<body>
<div id="last"></div>
<p id="text">text</p>
<a id="link" href="xxx">link</a>

<script>
$('#link').wrap('<div></div>').detach().insertAfter('#last');
</script>

</body>
</html>

Thanks you

Upvotes: 4

Views: 5661

Answers (4)

Andrew Jackman
Andrew Jackman

Reputation: 13966

$('#link').wrap('<div></div>'); don't need to detach or insertAfter, just use wrap function

Upvotes: 3

jAndy
jAndy

Reputation: 236022

Should look like:

$('#link').wrap('<div></div>').parent().insertAfter('#last');

Example: http://www.jsfiddle.net/4yUqL/2/

Ref.: .wrap()

Upvotes: 4

Phil.Wheeler
Phil.Wheeler

Reputation: 16848

In order to effectively do a Cut and Paste action on your element, you want to first wrap it in the DIV tags, detach it from the DOM and then insert it back in your target location (i.e. your "last" element):

$('#link').wrap('<div></div>').detach().insertAfter('#last');

Upvotes: 0

Swizec Teller
Swizec Teller

Reputation: 2322

This should do the trick

$("#link").wrap("<div></div>").detach().insertAfter("#last")

Upvotes: 0

Related Questions