Datapicker don't work

I want to make 2 datapickers to work but they don't. I think that everything in my code is ok but I don't know why it's not working. There is part of my code:

<head>
<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" />

<script src="//code.jquery.com/jquery-1.10.2.js"></script>
<script src="//code.jquery.com/ui/1.11.2/jquery-ui.js"></script>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script>
  $(function() {
  $( "#datepicker" ).datepicker();
  });
</script>
</head>

<body>
<table>
<tr>
<td>Data1 :
    <input type="text" id="datepicker"></td>
<td>Data2 :
    <input type="text" id="datepicker"></td>
 </tr>
</table>
<button>Next</button>
</body>

Can You tell me what is wrong with this code?

Solution

As mentioned in the comments, Multiple Id's are Invalid mark up.

To make this work change the Id to class

<table>
<tr>
<td>Data1 :
    <input type="text" class="datepicker"></td>
<td>Data2 :
    <input type="text" class="datepicker"></td>
 </tr>
</table>

and change the Jquery selector like this:

<script>
  $(function() {
      $( ".datepicker" ).datepicker();
  });
</script>