title: jQuery UI Datepicker only respond to the first textbox
body: <p>I'm trying to create a table with multiple rows and each row has a text box for user to input the date using the jQuery UI Datepicker. The problem is that the Datepicker is only updating the text box in the first row. Here is the datepicker function in the <code>&lt;head&gt;</code>:</p>
  
  <pre><code>&lt;script&gt;
  $(function() {
      $('.dateinput').datepicker({ dateFormat: 'dd/mm/yy' }).val();
  });
  &lt;/script&gt;
  </code></pre>
  
  <p>This is the text box:</p>
  
  <pre><code>&lt;?php
  while($fetch = mysql_fetch_array($query))
  {
      echo "&lt;td&gt; &lt;input type='text' id='dateinput' name='dateinput[]' value='" .date('d/m/Y'). "' class='dateinput' /&gt; &lt;/td&gt;";
  }
  ?&gt;
  </code></pre>
  
  <p>Any help would be very much appreciated. :)</p>