javascript - how to multiply price with quantity -

i know question has been asked many times not find 1 fits contition. far have dynamically created table checkbox. rows checked put array futher processing , table generated conformation issue here unable multiply quantity price. (note - rows have same id's , names dynamic) code -

<table class="table" id="mytable">          <thead class="text-danger">                <th>name</th>                 <th>price</th>                 <th>quantity</th>                  <th>select</th>             </thead> <tbody>  <?php while($row = mysqli_fetch_assoc($result)) { ?> <tr> <td><?php echo $row["name"]; ?> <input type="hidden" name="proname" value="<?php echo $row["name"]; >" /> </td> <td class="text-warning"><?php echo $row["price"]; ?> <input type="hidden" name="price" id="pri01" value="<?php echo $row["price"]; ?>" /> </td> <td> <div class="numbers-row"> <div class="col-sm-2"> <div class="form-group">     <input type="text" class="form-control" name="qua" id="qua01" value="1" style="cursor:default" disabled /> </div> </div> </div> </td> <td> <div class="checkbox"> <label>       <input id="name" type="checkbox" name="name" value="<?php echo $row["food_id"]; ?>"/> </label> </div> </td> </tr> <?php } ?> </tbody> </table> <center><button type="submit" class="btn btn-warning tble_submit" data-toggle="modal" data-target="#mymodal">order</button></center>   <!-- here second table shown displays rows checked in first table -->  <div id="showdata"></div> 

js -

 $(function() { $('.tble_submit').click(function(){     var values = [];     $("#add input[name=name]:checked").each(function(){          row = $(this).closest("tr");         values.push({              id        : $(this).val(),             name      : $(row).find("input[name=proname]").val(),             price     : $(row).find("input[name=price]").val(),             quantity  : $(row).find("input[name=qua]").val()                });     });     // console.log(values);    if(values.length != 0){     var col = [];     (var = 0; < values.length; i++) {         (var key in values[i]) {             if (col.indexof(key) === -1) {                 col.push(key);             }         }     }       var table = document.createelement("table");      table.setattribute("class", "table");       var tr = table.insertrow(-1);                   // table row.      (var = 0; < col.length; i++) {         var th = document.createelement("th");      // table header.         th.innerhtml = col[i];         tr.appendchild(th);     }      (var = 0; < values.length; i++) {          tr = table.insertrow(-1);          (var j = 0; j < col.length; j++) {             var tabcell = tr.insertcell(-1);             tabcell.innerhtml = values[i][col[j]];         }     }     var divcontainer = document.getelementbyid("showdata");     divcontainer.innerhtml = "";     divcontainer.appendchild(table);    } else {  document.getelementbyid("showdata").innerhtml = "xxxx"; } });  });