JavaScript DOM append methods

<!DOCTYPE html>
<html>
    <head>
        <title>Page Title</title>
        <style>
            div#test{
    background: hotpink;
    border: 2px solid black;
    width:350px;
    height:200px;
}
        </style>
    </head>
    <body>
        <h1>DOM append methods</h1>
        <div id="test">
            <h3>This is h3 tag</h3>
            <p>This is p tag</p>
        </div>
        <script>
            var newElement = document.createElement("h2");
            var newText = document.createTextNode("This is just text");
            newElement.appendChild(newText); document.getElementById("test").appendChild(newElement);
            console.log(newElement);
            var newComment = document.createComment("This is just comment");
            document.getElementById("test").appendChild(newComment);
            console.log(newComment );
            var target=document.getElementById("test");
            target.insertBefore(newElement,target. children[0]);
        </script>
    </body>
</html>


OUTPUT



Comments