How can I get the value of dynamically created input?

Question

I cant get the value of input created dynamically.

I want to create dynamic input with a number entered by the user and then calculate the sum of this input

Code From HTML:

<input disabled type="text"  id="totalPrice" value="{$tv}"> 
  
(Entrer le nbr )  <input type="text" id="member" name="member" value="" class="price"  onkeypress="addFields(event)"> <input type="checkbox" name="Checkbox" id="checkbox1" value="1" /><br />

and this is javascript code to create the input

<script>
        function addFields(){
            var number = document.getElementById("member").value;
            var container = document.getElementById("container");
            while (container.hasChildNodes()) {
                container.removeChild(container.lastChild);
            }
            for (i=0;i<number;i++){
                container.appendChild(document.createTextNode("Svp entrer L : " + (i+1)));
                var input = document.createElement("input");
  
    var input1 = document.createElement("Checkbox");
                input.type = "text";
   input.className = "price1";
                container.appendChild(input);
 
                container.appendChild(document.createElement("br"));
            }
        }
</script>

Here is the JQuery code I am having an issue with:

<script>
$(document).ready(function(){
$('price').keyup(function () {   
    // initialize the sum (total price) to zero
    var sum = 0;
     
    // we use jQuery each() to loop through all the textbox with 'price' class
    // and compute the sum for each loop
    $('.price').each(function() { 
        sum += Number($(this).val());
    });
     
    // set the computed value to 'totalPrice' textbox
    $('#totalPrice').val(sum);  
});
});    
</script>