php variable in ajax doesn't change value -

i have button while loop on php file. button associated php value changing mysqli_fetch_array. load 3 values in mysqli_fetch_array. ajax function has data in it, problem is accepting first row's value, , not other rows value. in fact, function ok @ first row of mysqli_fetch_array, , seems code not working on other rows, if php loop stopped @ first row.

here javscript code (it declared on same page of loop, after while):

<script type="text/javascript">   $(document).ready(function() {     $("#up").click(function() {       var varno_commentaire = $("#no_commentaire").val();        $.ajax({         url: "upvotecommentaire.php",         type: "post",         data: {           no_commentaire: varno_commentaire         },         async: false,         success: function(result) {           alert(result);         }       });     });   });  </script> 

and here php loop :

<?php  while($comm = mysqli_fetch_array($res2)) {     echo         '<label class="text-muted">'.$comm['desc_commentaire'].'</label>'.             '<p>'.         '<a href="">'.'@'.$comm['login'].'</a>'.             '<p>'.         '<label>'.$comm['vote_commentaire'].' points'.'</label>'.             '<p>'.         '<input type="text" value="'.$comm['no_commentaire'].'" id="no_commentaire"/>'.         '<button class="btn btn-default" name="up" id="up">+</button>'.             '&nbsp'.         '<button class="btn btn-default" name="down" id="bold" onclick="downvote()">-</button>'.             '<p>'.         '<hr/>'; } ?> 

i hope easy understand. appreciated, i've been stuck on moment. lot.

first of all, can't declare more once id. id should unique. can pass id html attribute.

your loop:

<?php  while($comm = mysqli_fetch_array($res2)) {     echo         '<label class="text-muted">'.$comm['desc_commentaire'].'</label>'.             '<p>'.         '<a href="">'.'@'.$comm['login'].'</a>'.             '<p>'.         '<label>'.$comm['vote_commentaire'].' points'.'</label>'.             '<p>'.         '<input type="text" value="'.$comm['no_commentaire'].'"/>'.         '<button class="btn btn-default btn-up" data-id="'.$comm['no_commentaire'].'">+</button>'.             '&nbsp'.         '<button class="btn btn-default btn-down" data-id="'.$comm['no_commentaire'].'">-</button>'.             '<p>'.         '<hr/>'; } ?> 

your script:

<script type="text/javascript">   $(document).ready(function() {     $("button.btn-up").click(function() {       var varno_commentaire = $(this).data('id');        $.ajax({         url: "upvotecommentaire.php",         type: "post",         data: {           no_commentaire: varno_commentaire         },         async: false,         success: function(result) {           alert(result);         }       });     });   });  </script>