title: How to add calendar text box dynamically using javascript?
body: <p>I have to add a calendar text box dynamically on each click on a link. I have tested some codes. For the first declaration it works and not for the others. 
   Here's my code:</p>
  
  <pre><code>&lt;head&gt;
      &lt;script type="text/javascript"&gt;
          $(function () {
              $(".hajanDatePicker").datepicker();
          });
      &lt;/script&gt;
      &lt;script type="text/javascript"&gt;
          var intTextBox=0;
  
          function addElement(){
              var contentID = document.getElementById('content');
              var newTBDiv = document.createElement('div');
              newTBDiv.setAttribute('id','txtDatePicker');
              newTBDiv.innerHTML +="Date:&lt;input id='txtDatePicker' type='text' name='test1'&gt;"; 
              contentID.appendChild(newTBDiv);
          }
      &lt;/script&gt;
  &lt;/head&gt;
  &lt;body&gt;
      &lt;form id="form1" method="get"&gt;
          &lt;div id="content"&gt;
              &lt;input type="text" id="txtDatePicker" name="test1"/&gt;
          &lt;/div&gt;  
          &lt;p&gt;&lt;a href="javascript:addElement();" &gt;Add&lt;/a&gt;   
      &lt;/form&gt;
  &lt;/body&gt;    
  </code></pre>
  
  <p>When the form loads can get the calender. After clicking "Add" it just opens as a normal text box and not as calendar.</p>