autofill (jQuery) not working with dynamic added rows in HTML Form

Question

I am trying to autofill my PHP form by retrieving data from mysql table. It works fine on one row. The problem which I am facing is that when I dynamically add new rows using Javascript, then the auto fill does not work in dynamically created row. I want to knew how can I do autofill with dynamic created row

This is html markup:

<td>
    <input type="text" class="form-control text-end" name="scode[]" id="aaa"                    
           onkeyup="GetDetail(this.value)" value="">
</td>
<td>
    <input type="text" class="form-control text-end" 
           name="servproname[]" id="bbb">
</td>
<td>
    <input type="text" class="form-control text-end" name="qty[]"  
           id="ccc" >
</td>

This is the Javascript for add new row dynamically

function BtnAdd()
{
    /*Add Button*/
    var v = $("#TRow").clone().appendTo("#TBody");
    $(v).find("input").val('');
    $(v).removeClass("d-none");
    $(v).find("th").first().html($('#TBody tr').length - 1);
}

This is jQuery:

<script>
    // onkeyup event will occur when the user
    // release the key and calls the function
    // assigned to this event
    function GetDetail(str) {
        if (str.length == 0) {
            document.getElementById("bbb").value = "";
            document.getElementById("ccc").value = "";

            return;
        }
        else {
            // Creates a new XMLHttpRequest object
            var xmlhttp = new XMLHttpRequest();
            xmlhttp.onreadystatechange = function () {

            // Defines a function to be called when
            // the readyState property changes
            if (this.readyState == 4 &&
                this.status == 200) {
                    
                // Typical action to be performed
                // when the document is ready
                var myObj = JSON.parse(this.responseText);

                // Returns the response data as a
                // string and store this array in
                // a variable assign the value
                // received to first name input field
                
                document.getElementById("bbb").value = myObj[0];
                document.getElementById("ccc").value = myObj[1];
            }
       };

        // xhttp.open("GET", "filename", true);
        xmlhttp.open("GET", "gfg.php?user_id=" + str, true);
            
        // Sends the request to the server
        xmlhttp.send();
    }
}
</script>

This is php script

<?php

       // Get the user id
          $user_id = $_REQUEST['user_id'];

           // Database connection
            $con = mysqli_connect("localhost", "root", "", "hmis");

            if ($user_id !== "") {

               // Get corresponding first name and
                 // last name for that user id  
                 $query = mysqli_query($con, "SELECT name, qty1 FROM machine1 WHERE user_id ='$user_id'");

                     $row = mysqli_fetch_array($query);

            // Get the first name
                  $bbb = $row["name"];
              $ccc = $row["qty1"];
            }
               // Store it in a array
                  $result = array("$bbb", "$ccc");

                // Send in JSON encoded form
               $myJSON = json_encode($result);
            echo $myJSON;
          ?>