How do I replace instead of append in jQuery

Question

i am using a jquery plugin to upload files, the plugin checks the file dimension and return back the appropriate error message. the error message i am displaying is with this code.

$('#divmsg6').append("<p class = 'red'>Incorrect file dimension, try again</p>");

now if the user keep on trying the error will keep on appending, that's what append is meant for. instead of appending i want my error code to be replaced every time it finds one. what is the js code for that?

Answer 1

For me, it would be better to hide/show error than, removing/adding the same thing.

html

<div id="divmsg6"><p class = 'red'>Incorrect file dimension, try again</p></div>

css

#divmsg6 p.red {
   display: none;
}

when error occurs, jQuery it like this,

$('#divmsg6 p.red').show(); // show error message.

then you might want to hide on some time.

$('#divmsg6 p.red').show(function(){
    var $this = $(this);
    setTimeout(function(){
       $this.fadeOut(1500);
    },1500);
});

or any other variation of hiding it will do, just show it again when error occur.

simple demo

Answer 2

You can use the html() method:

$('#divmsg6').html("<p class = 'red'>Incorrect file dimension, try again</p>");