title: jQuery datepicker not working for multiple instances
body: <p>I am trying to create new datepicker every time a place in google maps is selected.</p>
  
  <pre><code>           $(function(){$(".datepick").datepicker({
                dateFormat : "yyyy-MM-dd"
                }); 
             });
  
    var tomakedate = document.getElementById("fordate");
  </code></pre>
  
  <p>This is the event on which a new datepicker will be added in html.</p>
  
  <pre><code>                    selectedplacessize = selectedplaces.length;
                      inputcal = document.createElement("input");
                      inputcal.type = "text";
                      inputcal.name = "datepicker" + selectedplacessize;
                      inputcal.setAttribute("id","datepicker" + selectedplacessize);
                      inputcal.className = "datepick hasDatepicker";
                      tomakedate.appendChild(inputcal);
  </code></pre>
  
  <p>In browser my html with newly added datepicker looks like this.</p>
  
  <pre><code>         &lt;td id="fordate"&gt; &lt;input type="text" id="inputlatlong" name="inputlatlong" hidden=""&gt;
           &lt;input type="text" id="datepicker" name="datepicker" class="datepick hasDatepicker"&gt;
           &lt;input type="text" name="datepicker1" id="datepicker1" class="datepick hasDatepicker"&gt;&lt;/td&gt;
  </code></pre>
  
  <p>input element with id#datepicker, will be there when the page loads. Everytime a place is selected on google maps, another input type with class "datepick" will be added.
  There are not errors or warnings in inspect element of browser.</p>
  
  <p>Edit: I have tried replacing the line:</p>
  
  <p>inputcal.className = "datepick hasDatepicker"; with </p>
  
  <p>inputcal.className = "datepick";</p>
  
  <p>It's still not working.</p>