Here's what I find interesting/confusing, taking another look at the code. Here is the generated HTML of one of my sliders:
code
<input type="number" data-type="range" class="init_slider ui-input-text ui-body-b ui-corner-all ui-shadow-inset ui-slider-input" name="init_slider_0" id="init_slider_0" min="-5" max="30">
/code
But right below that code I see the following:
code
<a href="#" class="ui-slider-handle ui-btn ui-btn-up-b ui-shadow ui-btn-corner-all" data-corners="true" data-shadow="true" data-iconshadow="true" data-wrapperels="span" data-theme="b" role="slider" aria-valuemin="-5" aria-valuemax="30" aria-valuenow="3" aria-valuetext="3" title="3" aria-labelledby="init_slider_label_0" style="left: 22.857142857142858%;"><span class="ui-btn-inner"><span class="ui-btn-text"></span></span></a>
/code
Note the "aria-valuenow" attribute, which contains the actual value I want. I tried to capture it with jQuery, but I don't have an id. In fact, I have no idea where these "aria" attributes are coming from or where the 'a href' is being created. But I think there lies my issue...