Replace HTML content depending on Javascript function

I would like to display different HTML elements regarding the status of a variable.

In my HTML file, I have :

<div id="dustbinstatus"></div>

And in my JS file, I have :

if (message.payloadString == "full"){ 
    $('#dustbinstatus').append('<i class="material-icons">delete</i>');
} 

else if (message.payloadString == "empty"){
    $('#dustbinstatus').append('<p> Dustbin ok </p>');
}

The message.payloadString variable can change dynamically using websockets. With this example, it works but it just adds a new line everytime the status changes and I would like a single line to be replaced and change depending on the status.

Is there a way to do that ?

Thank you !

Olivia