How to add html tag in div using jquery
How to add html code in div tag using jquery
In this tutorial, you will learn how to add html code in div tag using jquery.
We will be using jQuery append() method or html() method to add the html code in div tag in jquery as given below example:
Syntax:
$(selector).append( code )
$(selector).html( code )
Example:
<!DOCTYPE html>
<html lang="en">
<head>
<title>How to add text in p tag using jquery</title>
</head>
<body>
<div id="appendMethodCodeDemo"></div>
<div id="htmlMethodCodeDemo"></div>
<button type="button" id="myButton">Click Me</button>
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script>
$(document).ready(function () {
$('#myButton').click(function (e) {
e.preventDefault();
var htmlCode_content = '<div> I am div with append() <h5>I am Heading</h5> <p>I am para</p> <hr/> </div>';
$('#appendMethodCodeDemo').append(htmlCode_content); //html() Method
var htmlCode_content = '<div> I am div with html() <h5>I am Heading</h5> <p>I am para</p> <hr/> </div>';
$('#htmlMethodCodeDemo').html(htmlCode_content); //html() Method
});
});
</script>
</body>
</html>
Thanks for reading.