.html () returns undefined

Question

I am new to jQuery and it is hard for me to get the contents of a div block.

<div class="update_status"> Updated successfully </div> 

And when the following script is executed:

 $(document).ready(function () { $(function () { var $status_div = $("#update_status"); if ($status_div) { alert("1"); alert($status_div.html()); alert("2"); } else { alert("undefined"); } }); }); 

I get three warnings: "1", "undefined" and "2". I expected to get "Updated successfully." Any ideas on what I did wrong?

Answer 1

# used to find id elements. You are using a class, so you need to .

 $(".update_status"); 

http://api.jquery.com/category/selectors/

Answer 2

update_status is a class, so the selector should be as follows:

var $status_div = $(".update_status");

Answer 3

Change class to id

 <div class="update_status"> Updated successfully </div> 

For

 <div id="update_status"> Updated successfully </div> 

Answer 4

You must use . instead of # since this is class not a id

var $status_div = $(".update_status");

And also use

if ($status_div.length) {

but not

if ($status_div) {

because the latter always returns a true