<html>  
<head>  
    <title>Javascript Create Div Element Dynamically</title>  
    <style type="text/css">  
        .dynamicDiv {  
            width: 200px;  
            height: 100px;  
            border: solid 1px #c0c0c0;  
            background-color: #e1e1e1;  
            font-size: 11px;  
            font-family: verdana;  
            color: #000;  
            padding: 5px;  
        }  
    </style>  
  
    <script type="text/javascript" language="javascript">  
    <![CDATA[ 
        function createDiv() { 
            var divTag = document.createElement("div"); 
 
            divTag.id = "div1"; 
 
            divTag.setAttribute("align", "center"); 
 
            divTag.style.margin = "0px auto"; 
 
            divTag.className = "dynamicDiv"; 
 
            divTag.innerHTML = "This HTML Div tag created "  
                                + "using Javascript DOM dynamically."; 
 
            document.body.appendChild(divTag); 
        } 
    ]]>  
    </script>  
</head>  
<body>  
    <p align="center">  
        <b>Click this button to create div element dynamically:</b>  
        <input id="btn1"   
                type="button"   
                value="create div"   
                onclick="createDiv();" />  
    </p>  
</body>  
</html> 