PHP循环中的jquery ajax

I'm trying to update records using jquery ajax while in a loop. using two pages, index.php and update.php the data display works fine but when I click on update button all datas get delete don't know why, I really appreciate some help

 <?php
    $conn = new mysqli('localhost', 'root', '123456', 'lc');
    $sql = "SELECT * FROM lc where customer='souhail'";
    $result = $conn->query($sql);
    while ( $row=mysqli_fetch_assoc($result)) {       
       echo  'LC ID :<input type="text" id="fname" value="'.$row['element_6'].'"><br>';         
       echo  'Status :<input type="text" id="lname" value="'.$row['element_101'].'"><br>';
       ?>
       <button type="button" style="background-color:<?php
    if($row['element_101'] == '1'){
        echo '#0000FFF';

    }elseif ($row['element_101'] == '2'){
        echo '#ffff00';

    }elseif ($row['element_101'] == '3'){
        echo '#00FF00';

    }elseif ($row['element_101'] == '4'){
        echo '#ffffff';

    }
    //echo $row['element_101'];
    ?>;color:#000000" type="submit" id="update">Go Forward ></button>
<br><br>
<?php

    }?> 

    </center>
    <script>
        $(document).ready(function(){
            $("#update").click(function(){
                var fname=$("#fname").val();
                var lname=$("#lname").val();
                $.ajax({
                    url:'update.php',
                    method:'POST',
                    async: true,
                    data:{
                        fname:fname,
                        lname:lname
                    },
                    success:function(response){
                        alert(response);
                    }

                });
            });
        });
    </script>

enter image description here