JSFiddle - React, Tailwind, and code Playground

HTML

<script src="//cdnjs.cloudflare.com/ajax/libs/noUiSlider/5.0.0/jquery.nouislider.min.js"></script>
<link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/noUiSlider/5.0.0/jquery.nouislider.min.css">
<div id="sample-update-slider"></div>
<div id="value"></div>

CSS

#sample-update-slider { margin: 50px; }

JavaScript

function reverse ( a ) {
    return a.split('').reverse().join('');
}

var slider = $('#sample-update-slider');
slider.noUiSlider({
    range: [0, 10000000],
    start: 11500,
    handles: 1,
    margin: 2,
    step: 250,
    serialization: {
         resolution: 1
        ,to: function(a){            
            a = "$" + reverse(reverse(a).match(/.{1,3}/g).join(','));            
            $("#value").text( a );
        }
    }    
});