JSFiddle - React, Tailwind, and code Playground

HTML

<div class="slider-holder">
  <div class="slider"></div>
  <div class="slider-labels"></div>
</div>

<div class="slider-holder">
  <div class="slider"></div>
  <div class="slider-labels"></div>
</div>

CSS

.slider-holder {
  width:500px;
  height:50px;
  margin:auto;
}
.slider-labels {
   position:relative;
}
.slider-labels span {
  position:absolute;
  color:#000;
}

JavaScript

$( ".slider" ).slider({
      min: 0,
      max: 100,
      step: 10,
      create : function(event,ui) {
        var maxValue = $(this).slider("option","max");
        var stepValue = $(this).slider("option","step");
        var steps = maxValue/stepValue;
        for(i=0;i<=steps;i++) {
          var val = stepValue*i; 
          $(event.target).next().append('<span style="left:'+val+'%;">'+val+'</span>');
        }
      }
    });