How to create textbox in html dynamically using javascript

If you want to generate or add dynamically textbox or any other html element using by JavaScript so this post is only for you.
Here we are introducing simple JavaScript code for generate dynamically HTML element.

HTML CODE

<div style="text-align:center;">
    <input type="hidden" value="1" id="TextBoxValue" />
    <input type="button" onclick="AddDynamicTextBox()" value="Add Pharmacist" />
</div>

<div id="AddAnotherTextBox"></div>

JavaScript CODE

<script>
function AddDynamicTextBox()
{
    var TextBoxValue = document.getElementById("TextBoxValue").value;
    
    document.getElementById("AddAnotherTextBox").innerHTML+='<input type="text" name="PharmacistTextbox'+TextBoxValue+'" id="PharmacistTextbox'+TextBoxValue+'" placeholder="Text Box '+TextBoxValue+'" reuired="" />';
    
    TextBoxValue++;
    document.getElementById("TextBoxValue").value=TextBoxValue;    

}
</script>

CSS CODE

<style>
#AddAnotherTextBox{width:350px; float:none; margin:auto;}
#AddAnotherTextBox input[type="text"]{width:96%; padding:2%; margin-bottom:5px;}
input[type="button"]{width:200px; margin:auto; background:#006666; color:#FFFFFF; font-size:20px; border:0px; border-radius:5px; padding: 10px; text-transform: uppercase; cursor:pointer;}
</style>