Extracting Ajax return data in jQuery

Question

I have done jQuery and Ajax, but I am not able to get the response into a Div element. This is the code:

Index.html

$.ajax({
    type:"POST",
    url: "ajax.php",
    data:"id="+id ,
    success: function(html){
        $("#response").html(data);
    }
});

It is receiving the response to my <div id="response"></div>.

The ajax.php returns following code to the index.html file:

<div id ="one"> OneVal </div>
<div id ="sub"> SubVal </div>

Will I able to extract the OneVal and Subval into a variable, and how can I extract "OneVal" and "SubVal", instead of above response?

Answer 1

Change the .find to .filter...

Answer 2

I have noticed that your success function has the parameter "html", and you are trying to add "data" to your elements html()... Change it so these both match:

$.ajax({
    type:"POST",
    url: "ajax.php",
    data:"id="+id ,
    success: function(data){
        $("#response").html(data);
    }
});

Answer 3

You can use json like the following example.

PHP code:

echo json_encode($array);

$array is array data, and the jQuery code is:

$.get("period/education/ajaxschoollist.php?schoolid="+schoolid, function(responseTxt, statusTxt, xhr){
    var a = JSON.parse(responseTxt);
    $("#hideschoolid").val(a.schoolid);
    $("#section_id").val(a.section_id);
    $("#schoolname").val(a.schoolname);
    $("#country_id").val(a.country_id);
    $("#state_id").val(a.state_id);
}