<!DOCTYPE html>
<html>

<head>
  <meta charset="utf-8" />
  <title></title>
  <script data-require="jquery" data-semver="3.0.0" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.0.0/jquery.js"></script>
  <script src="script.js"></script>

  <style>
    table {
      border-collapse: collapse;
    }
    
    table,
    td,
    th {
      border: 1px solid black;
    }
  </style>
</head>

<body>


<div class="Slider"><input type="range" class="sliderInputRange" min="0" max="100" data-value-id="value1"></div> 
<b><div id="value1">value: %</div></b> 

<div class="Slider"><input type="range" class="sliderInputRange" min="0" max="100" data-value-id="value2"></div> 
<b><div id="value2">value: %</div></b> 


</body>

</html>
$(window).on("load", function(){
         var slider = $(".sliderInputRange");
         slider.change(function(){
           
            var value_id= $(this).attr("data-value-id");
           
             $("#" + value_id).html (" value : " + this.value + "%"); 
        });
    });