Ajax - trying to replace instead of append

Question

I know nothing about ajax. I'm using flask to run a web app with python. This is regarding the response after submitting a form. All is working fine, except every time I press submit the latest response is appended under the last (until you refresh the page). I have narrowed it down to only one possible section of the config based on the output. This is the section I'm confused by:

    response =response.result;
                     $.each(response,function(key,val){
                     console.log(val);
                        html+="<p>"+val+"<p>"
    
                    });
                    html +="<br>";
                    $(".show-data").append(html);
                });

I noticed 'append(html)' which lead me to search some ajax functions. I've tried: '$(".show-data").replaceWith(html);' which I've seen work elsewhere but not here.

Does anyone with a good understanding of Ajax have any ideas what to do here? Thanks in advance for any advice.

Answer 1

You could change your $(".show-data").append(html); to $(".show-data").html(html);

html() works more or less like innerHTML from standard javascript.