AJAJ / PHP Multiple Append Problem

[CoconutJJ]

I have a problem with the jQuery AJAX Append function. Everytime I append a comment to the <span>, not only does it append that single one, but also replicates every other comment dynamically generated by the PHP. So I end up with multiple repeated comments. However, the repeated comments aren't stored in the database, so whenever I refresh the page, it goes away. How can I prevent this without refreshing the page everytime?

 

PHP: To display all comments

<span id="commentHint"></span><?phpecho "<b>$comment_user said:</b><small>$comment_time</small><br>";            echo "$comment<br>";?>

AJAX: Comment On Submit

<script>       $(document).ready(function () {                var form = $('#form');                var submit = $('#submit');                form.on('submit', function (e) {                    // prevent default action                    e.preventDefault();                    // send ajax request                    $.ajax({                        url: 'commentpost.php',                        type: 'POST',                        cache: false,                        data: form.serialize(),                        beforeSend: function () {                            // change submit button value text and disabled it                            submit.val('Submitting...').attr('disabled', 'disabled');                        },                        success: function (data) {                            var item = data;                                $('#commentHint').append(item); //Appends it to div.                            form.trigger('reset');                            submit.val('Submit Comment').removeAttr('disabled');                        },                        error: function (e) {                            alert(e);                        }                    });                });            });</script>

[justsomeguy]

What does commentpost.php return?