Update div on event

Question

I am using the jquery slider and using append() to update the value, but it will keep adding it unless I empty it on the start event. Is there a way where I can just updated the value instead of printing it out every time the action takes place. i tried replaceWith but no luck there.

   start: function(event, ui){
    $('#current_value').empty(); 
   },
   slide: function(event, ui){
    $('#current_value').fadeIn().append('Value is '+ui.value);

   },

Thanks,

Ryan

Answer 1

If i understand you right, you should:

var existing = $('#current_value').html();
$('#current_value').html(existing + ui.value).fadeIn();

Answer 2

you need to use html() not append(), append adds the value at end of the given element, html sets the innerHtml for the given element.

$('#current_value').html('Value is '+ui.value).fadeIn();

Answer 3

You probably want something like

slide: function(event, ui){
    $('#current_value').text('Value is '+ui.value);
    $('#current_value').fadeIn();
}

text() documentation