title: how to multiply input value of each div with same id
body: <p>I have several line of div with same id, i would like to multiply two input value of each div and display result in third input after changing value of val1 input or val2 input</p>
  
  <p>html</p>
  
  <pre><code>&lt;div class="uk-width-medium-9-10" id="commandligne"&gt;
      &lt;div class="uk-grid uk-grid-small" data-uk-grid-margin&gt;
          &lt;div class="uk-width-medium-2-10"&gt;
              &lt;label for="inv1"&gt;P.U. (€)&lt;/label&gt;
              &lt;input type="text" name="prix-item[]" class="md-input val1"  id="inv1"/&gt;
          &lt;/div&gt;
          &lt;div class="uk-width-medium-2-10"&gt;
              &lt;label for="inv2"&gt;Qté (H)&lt;/label&gt;
              &lt;input type="text" name="qte-item[]" class="md-input val2" id="inv2" /&gt;
          &lt;/div&gt;
          &lt;div class="uk-width-medium-2-10"&gt;
              &lt;label for="inv3"&gt;Total(€)&lt;/label&gt;
              &lt;input type="text" name="total-item[]" class="md-input val3" value="0" id="inv3" readonly/&gt;
          &lt;/div&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>My JS that doesnt work at all</p>
  
  <pre><code> $(document).ready(function () {
         $("#commandligne input").keyup(multInputs);
  
         function multInputs() {
             var mult = 0;
             // for each row:
             $("div#commandligne").each(function () {
                 // get the values from this div:
                 var $val1 = $('.val1', this).val();
                 var $val2 = $('.val2', this).val();
                 var $total = ($val1 * 1) * ($val2 * 1)
                 $('.val3',this).val($total);
             });
         }
    });
  </code></pre>
  
  <p>Nothing happen when i change value of 2 input, then i have 0 error .</p>
  
  <p>Here Jsfiddle 
  <a href="https://jsfiddle.net/a66bgddu/1/" rel="nofollow">https://jsfiddle.net/a66bgddu/1/</a></p>