JSFiddle - React, Tailwind, and code Playground
HTML
<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
<script src="http://code.jquery.com/ui/1.10.2/jquery-ui.js"></script>
<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.2/themes/smoothness/jquery-ui.css">
<div id="MasterSlider" class="slider"></div>
<div class="FirstSliderselector slider"></div>
<div class="FirstSliderselector slider"></div>
<div class="FirstSliderselector slider"></div>
<div id="output"></div>
JavaScript
$( ".slider" ).slider({
min: "1",
max: "10"
});
$("#MasterSlider").slider('value', 5);
var FirstSliders = $('.FirstSliderselector'),
MastSliderValue = $("#MasterSlider").slider("value"),
output = $('#output');
function updateSliders(){
output.append("<p>UPDATE SLIDERS</p>");
FirstSliders.slider('value', MastSliderValue);
}
$.when(
updateSliders()
).done(
function(){
for (var i = 0; i < FirstSliders.length; i++) {
output.append("<p>LOOP</p>");
}
}
);