jQuery append HTML to a Div
Demo and Code for how to add HTML codes to a div using jQuery append() metthod.
by Athil
Posted on 22 Jun 2019 Category: jQuery
Views: 1870
Here I am going to show how to add HTML tags into div using jQuery append()
DEMO
append() with control id
$("#divid").append("<h1>Heading appended</h1>");
This code brings an H1 tag to a div having id "divid".
append() with class name
$(".classname").append("<h1>Heading appended</h1>");
Where "classname" in double quotes is the name of the class of control.
Full Demo code
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Demo For jQuery apend to a div</title>
</head>
<body>
<script type="text/javascript" src="js/jquery.min.js" ></script>
<h1>Demo For jQuery apend to a div </h1>
<div id="divid" >My div</div>
<button id="btnAdd" onclick="appendHeading();"> append heading to div</button>
<script>
function appendHeading()
{
$("#divid").append("<h1>Heading appended</h1>");
}
</script>
</body>
</html>