JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css">
<script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
	<div class = "slider-module">

		<div class = "slider" aria-valuenow = "100"></div>
    
    		<label for = "price-range" class = "slider-value-label">Price range:</label>
        <input id = "price-range" type = "text" class = "slider-value" value = "$" />
	</div>

CSS

#price-range {
  margin: 15px 0px 0px 0px;
  height: 30px;
  width: 60px;
}

JavaScript

$(function() {
	$(".slider-module").each(function() {
		var SliderElement		= $(this).find(".slider");
		var SliderValue			= $(this).find(".slider-value");
		var SliderValuePrepend	= $(SliderValue).val();
		
		var ParamMin = 0;
		var ParamMax = 100;
		var ParamOrientation = "horizontal";
		
		var ValueminAttr = $(SliderElement).attr('aria-valuemin');
		if(typeof ValueminAttr !== "undefined" && typeof ValueminAttr !== false){
		
			ParamMin = parseInt(ValueminAttr, 10);
		
		}
		
		var ValuemaxAttr = $(SliderElement).attr('aria-valuemax');
		if(typeof ValuemaxAttr !== "undefined" && typeof ValuemaxAttr !== false){
		
			ParamMax = parseInt(ValuemaxAttr, 10);
		
		}
		
		var OrientationAttr = $(SliderElement).attr('data-orientation');
		if(typeof OrientationAttr !== "undefined" && typeof OrientationAttr !== false){
		
			ParamOrientation = OrientationAttr;
		
		}
		
		var StartAttr = $(SliderElement).attr('data-start');
		if(typeof StartAttr !== "undefined" && typeof StartAttr !== false){
			
			$(SliderElement).slider({
				min: ParamMin,
				max: ParamMax,
				values: [ parseInt($(SliderElement).attr('data-start'), 10), parseInt($(SliderElement).attr('data-end'), 10) ],		
				range: true,
				animate: true,
				orientation: ParamOrientation,
				slide: function(event, ui) {
					$(SliderValue).val(SliderValuePrepend + ui.values[0] + " - " + SliderValuePrepend + ui.values[1]);
				}
			});
			
			$(SliderValue).val(SliderValuePrepend + $(SliderElement).slider("values", 0) + "-" + SliderValuePrepend + $(SliderElement).slider("values", 1));
		
		}else{
			
			$(SliderElement).slider({
				min: ParamMin,
				max: ParamMax,
				value: parseInt($(SliderElement).attr('aria-valuenow'), 10),		
				range: "min",
				animate: true,
				orientation: ParamOrientation,
				slide: function(event, ui) {
					$(SliderValue).val(SliderValuePrepend + ui.value);
				}
			});
			
			$(SliderValue).val(SliderValuePrepend + $(SliderElement).slider("value"));
		
		}
		
	});
});