ARTICLE
Append and Wrap using JQuery
Using Append and Wrap in JQuery
Try the code below to Append one paragraph and wrap the existing div inside another div using jQuery:
Add the following code to the head section:
<head>
<title>jQuery wrapper</title>
<script type="text/javascript" src="./js/jquery-1.4.4.js"></script>
<script type="text/javascript">
$(document).ready(function() {
var dvWrap = $("#dvWrap");
var wrapper = dvWrap.wrap("<div></div>");
wrapper.css("border", "10px solid red");
wrapper.css("padding", "5px");
var inner = $("<p>This paragraph added with jQuery</p>");
inner.css("color", "blue");
inner.click(function(){alert("hello");});
wrapper.append(inner);
});
</script>
</head>
Add the following code to the body section:
<body>
<div id="dvWrap">
<h1>This is wrapped with a red box drawn by jQuery</h1>
</div>
</body>
You can download the working sample attached here.
Thanks
Shinu