get content of a div from a variable using jQuery

Question

i am building a php form with ajax and i am submitting the form variables to the same page where the form resides. my validating code looks like

if($valid){
    echo "<div id='retmsg'>Your message has been submitted successfully</div>";
}
else {
    echo "<div id='retmsg'>An error occured!</div>";
}

My ajax code

function form_submit() {
 $('#response').html('Loading...').fadeIn();
$.ajax({
    type: "POST",
url:  "<?php $_SERVER['PHP_SELF']; ?>",
data: "title=" + $('#title').val() + "&content=" + $('#contents').val(),
success: function(html){
var message = $("#retmsg").html(html);
alert(message);
  }

}); 
}

i need to alert the contents of div id "retmsg". But the alert shows me like "[Object Object]". Please help me...

Answer 1

Check

var message = $("#retmsg").value;

Answer 2

Try

 alert(message.html())

Answer 3

take a look at jquery`s html(). if you want to retrieve the html content of a certain element you need to use html() function with no arguments.

so from this:

var message = $("#retmsg").html(html);

to this:

var message = $("#retmsg").html();    

The "[Object Object]" that the

$("#retmsg").html(html);

returns is actually a jquery object. You can find more on jquery chain

Answer 4

Thanks for all gentle mens who shared my issue. As i mentioned in my description, as i submitted the form to the same page, the page loads again with all components i used such as jQuery library and js files i.e the whole document. That's the problem. I simply used if(post){ } else { form validation } for the whole html content and got it solved.