jQuery mobile event bind is a pain

Question

http://jsfiddle.net/ca11111/arwkS/1/

In this fiddle I wanted to bind mouseup of the slider button with a function that will reset the value.

The fiddle is working, but the only way I found is by putting this ugly timeout function, without it the slider doesn't exist yet so the binding fails, but reading the doc "mobileinit" event should have done the trick.

Can you improve this ugly script?

Edit: since I put the timeout it can be done like this of course:

setTimeout(function(){ 
    console.log($(".ui-slider-handle .ui-btn-inner").length);
    $(".ui-slider-handle .ui-btn-inner").mouseup(function() {
        console.log('Handler for .mouseup() called.');
        $("#slider-0").val(25).slider("refresh");
    });
}, 2000);

Answer 1

Using the live method to do your binding might solve this.

jQuery live method.

Description: Attach a handler to the event for all elements which match the current selector, now or in the future.

Here's a working example of your code.