包含jquery脚本还是在while循环中更改变量值？

Question

Attempting to call a php variable as a span id, the variable changes with the value of $i in a for statement. I'm using a for statement to call a series of products from the database, no problems there. However when attempting to have the jquery run for each product to show prices, only the first one shows. I have a JsFiddle with a small example of the code i have to show prices. http://jsfiddle.net/c6pso94f/. Should i trying an include-once per while loop and run script as booking.js?

I've tried to use the following:

echo "<span id='$priceblock'> </span>";

var priceblock1 = <?php echo $priceblock; ?>;

$('#'+ priceblock1).text('R ' + total +'/day');

in the code below:

I also have 2 select inputs and 4 checkboxes per item I created variable along the lines of $mySelect = "mySelect"."i"; so that the value of changes with each increased value of $i but that doesn't work as the value is the same for both select inputs. so i made the other one simply $mySelect1 = "mySelect1"."$i";. I have left the full script on Pastebin : https://pastebin.com/HQX3jJKd

  echo "<span>100kms:</span>";
  echo "<span id='$priceblock1'> </span>";
  echo "<span>200kms:</span>";
  echo "<span id='$priceblock2'> </span>";
  echo "<input type='hidden' name='stocknr' value='$stock'>";
  echo "<input type='hidden' name='pricef1' value=''>";
  echo "<input type='hidden' name='pricef2' value=''>"; 

  // Script that adds values together
  <script>
  $(document).ready(function(){
  $('input[name="ch3"]').click(function() {
    $('input[name="ch3"]').not(this).prop('checked', false);
   });
  });

  function displayVals() {
  calcUsage();
  var singleValues = $("#mySelect").val();         
  $("#pricef1").val(singleValues);
  }
  var $cbs = $('input[id="qr1"]');
  function calcUsage() {
  var total = $("#mySelect").val();
  $cbs.each(function() {
    if (this.checked)
        total = parseInt(total) + parseInt(this.value);
  });
  var priceblock1 = <?php echo $priceblock1; ?>;
  $('#' + priceblock1).text('R ' + total +'/day');
  }
  function displayVals1() {
  calcUsage1();
  var singleValues1 = $("#mySelect1").val();         
  $("#pricef2").val(singleValues1);
  }
  var $cbs1 = $('input[id="qr1"]');
  function calcUsage1() {
  var total1 = $("#mySelect1").val();
   $cbs1.each(function() {
    if (this.checked)
        total1 = parseInt(total1) + parseInt(this.value);
   });
    var priceblock2 = <?php echo $priceblock2; ?>;
     $('#'+priceblock2).text('R ' + total1 +'/day');
    }

   $("#mySelect").change(displayVals);
   displayVals();
   $("#mySelect1").change(displayVals1);
   displayVals1();
  //For  checkboxes

  $cbs.click(calcUsage);
  $cbs1.click(calcUsage1);
  </script>         

I'm trying to have each one show the price as it changes from options, checkboxes but it is only showing the first when i was using id="100kms" and id="200kms" respectively. i changed it so $priceblock is $priceblock1 = $priceblock1 + $i