Q:

jQuery: undefined displayed

I'd like to display the percentage of progress below jQueryUI progress bar.
HTML:
<div class="progressbar_container">
    <div id="progressbar" class="progressbar_child"></div>
    <div id="percent" style="text-align: center;"></div>
</div>

Script:
$(function () {
    var count = 0;
    setInterval(function () {
        count = count + 1;
        $("#progressbar").progressbar({
            max: 10,
            value: count,
            change: function (event, ui) {
                $("#percent").html(ui.value);
            }
        });
    }, 500);
});

But, it displays: undefined %.
Also, it displays it a bit after the progress started, which means: 2, 3... It doesn't display: 0, 1...
What I'm doing wrong?

A:

The ui argument in change event is a dummy placeholder as indicated in the docs. 
You need to use the value method for getting the value.
...
change: function (event, ui) {
    $("#percent").html($("#progressbar").progressbar( "value" ));
}
...

