title: jQuery range slider value box for multiple divs
body: <p>I'm new in js and jQuery and I managed to create a simple slider with a value indicator box under it, that displays the slider's current value. I have used the following code:</p>
  
  <p>HTML</p>
  
  <pre><code>&lt;div class="Slider"&gt;
      &lt;input type="range" id="slider" min="0" max="100"&gt;
  &lt;/div&gt; 
  &lt;b&gt;&lt;div id="Value"&gt;value: %&lt;/div&gt;&lt;/b&gt; 
  </code></pre>
  
  <p>JS</p>
  
  <pre><code>    $(window).on("load", function(){
           var slider = $("#slider");
           slider.change(function(){
               $("#Value").html (" value : " + this.value + "%"); 
          });
      });  
  </code></pre>
  
  <p>I want to use the same slider in multiple div that are hidden and appear in the same position when i click some links. The problem is that although the slider and the value box appear, the output value which is controlled by the jQuery function won't work but for the first div.</p>
  
  <p>Can anybody tell me what to change to fix this?</p>