title: jQuery datepicker won't work on a AJAX added html element
body: <p>I have a jQuery datepicker function bound to the "birthday" input html element, written in the page header: </p>
  
  <pre><code>&lt;script type="text/javascript"&gt;
      $(function() {
          $( "#birthday" ).datepicker();
      });
  &lt;/script&gt;
  </code></pre>
  
  <p>Next, I have some AJAX functionality - it adds new input html element to the page. That element is: </p>
  
  <pre><code>&lt;input type="text" id="birthday" value="" class="detail-textbox1" /&gt;
  </code></pre>
  
  <p>Clicking on that <em>birthday</em> element does not pop up the date picker below the text field. I expected this, as the element is added after the page is loaded, thus it isn't in relation with the function provided in the header. </p>
  
  <p>How can I make it work? I tried moving the script from the header to the body, but nothing seems to work. Thanks. </p>
  
  <p>P.S. If I create an input html element with id="birthday" in the page body, everythig works as expected. It appears that only the elements added through AJAX are dysfunctional. </p>