Question

I have code that appends as follows:

if (json.expData[i] != null) {
    $('#text' + i)
    .append("<br><br><img src='/balloon.png'>" + json.expData[i]);
}

When a user clicks on a button this code runs and appends. However if the user clicks on the button again it appends once more and so on.

Is there some way that I could detect that the data has already been appended and only
make it add if it’s the first time?

Answer 1

You could store a boolean attribute on the element, such as data-isappended.

if (json.expData[i] != null) {
    var $text = $('#text' + i);
    if (!($text.data("isappended"))){
       $text.append("<br><br><img src='/balloon.png'>" + json.expData[i]);
       $text.data("isappended", true);
    }
}