Change the text in a div using jquery after form submit
<p><strong>Edit</strong> I realized my error shortly after posting this. The <code>append</code> should be <code>html()</code> or <code>text()</code></p>

<p>Partial code:</p>

<pre><code>&lt;script type="text/javascript" language="javascript"&gt;
        $(document).ready(function(){
            $('#resetpassword').validate(
            {rules: {
                secretAnswer: {
                    required: true
                }
            },

            messages: {
                secretAnswer: {
                    required: "Please answer your security question"
                }
            },
            submitHandler: function(form){
                $.post("../BackgroundOperations/resetpassword.php",
                    $('#resetpassword').serialize(),
                    function(data){
                        if(data.status == 0){
                            $('#message').append("&lt;span class='error'&gt;Error: " + data.message + "&lt;/span&gt;");
                        }
                        else{
                            $('.container').hide();
                            $('.short_explanation').hide();
                            $('#message').text(data.message);
                        }
                    },
                "json");
            }
            });
        });
    &lt;/script&gt;
&lt;/head&gt;
&lt;body&gt;

&lt;!-- Form Code Start --&gt;
&lt;div id='fg_membersite'&gt;
&lt;form id='resetpassword' method='post' accept-charset='UTF-8'&gt;
&lt;fieldset &gt;
&lt;legend&gt;Reset Password&lt;/legend&gt;

&lt;div class='short_explanation'&gt;* required fields&lt;/div&gt;
&lt;input type='text'  class='spmhidip' name='&lt;?php echo $vm-&gt;GetSpamTrapKey(); ?&gt;' /&gt;

&lt;div id="message"&gt;&lt;/div&gt;
&lt;div class='container'&gt;
    &lt;label for='emailAddress' &gt;Email Address:&lt;/label&gt;&lt;br/&gt;
    &lt;input type='text' name='emailAddress' id='emailAddress' maxlength="100" readonly="true" value="&lt;?php echo $vm-&gt;GetEmailAddress() ?&gt;" /&gt;&lt;br/&gt;
&lt;/div&gt;
&lt;div class='container'&gt;
    &lt;label for='secretQuestion' &gt;Security Question:&lt;/label&gt;&lt;br/&gt;
    &lt;input type='text' name='secretQuestion' id='secretQuestion' value='&lt;?php echo $vm-&gt;GetSecretQuestion() ?&gt;' maxlength="100" readonly="true" width="100" /&gt;&lt;br/&gt;
&lt;/div&gt;
&lt;div class='container'&gt;
    &lt;label for='secretAnswer' &gt;Answer:&lt;/label&gt;&lt;br/&gt;
    &lt;input type='text' name='secretAnswer' id='secretAnswer' maxlength="50" /&gt;&lt;br/&gt;
&lt;/div&gt;
&lt;div class='container'&gt;
    &lt;input type='submit' name='Submit' value='Submit' /&gt;
&lt;/div&gt;

&lt;/form&gt;
</code></pre>

<p>I'm testing invalid input (wrong security answer). When I put the wrong answer and submit the form the <code>&lt;div id="message"&gt;</code> gets updated with the error message, but if I keep submitting invalid data the <code>&lt;div id="message"&gt;</code> keeps the old error message with a new one added on the end instead of having just a single message.</p>
