title: Use keyup function in multiple table row
body: <p>I have a table that i can insert new row after click on a button. I would like to use a keyup function to make calcul between td values. My issue is the keyup function works for the first line, after I insert a new line the function affects the new line and previous line. How can I create the function to use it separately for each new row added ?</p>
  
  <p>Thanks in advance.</p>
  
  <pre><code>    &lt;button type="button" class="add-row" &gt;Add&lt;/button&gt;
  &lt;table&gt;
  &lt;tr&gt;
  &lt;td&gt;Amount&lt;/td&gt;
  &lt;td&gt;Price&lt;/td&gt;
  &lt;td&gt;Result&lt;/td&gt;
  &lt;/td&gt;
  &lt;/tr&gt;
  &lt;tr&gt;
  &lt;td class='amount' contenteditable='true'&gt;&lt;/td&gt;
  &lt;td class='price' contenteditable='true' onkeyup='calculfac()'&gt;&lt;/td&gt;
  &lt;td class='result'&gt;&lt;/td&gt;
  &lt;/tr&gt;
  &lt;/table&gt;
  
  &lt;script&gt;
  //Add new row on click
  $(".add-row").click(function(){
  var markup = "&lt;tr&gt;&lt;td class='amount' contenteditable='true'&gt;&lt;/td&gt;&lt;td class='price' contenteditable='true' onkeyup='calculfac()'&gt;&lt;/td&gt;&lt;td class='result'&gt;&lt;/td&gt;&lt;/tr&gt;";
  $("table tbody").append(markup);
  });
  
  //Calcul
  
  function calculfac() {
  var amount= $('.amount').text();
  var price= $('.price').text();
  var mult = amount * price;
  var result = Math.round(mult).toFixed(2);
  $('.result').text(result);
  }
  </code></pre>
  
  <p></p>