Is it possible to use jQuery to select elements from the returned html string?

Question

For the following jQuery code:

$("#select").change(function() {
    $("#output").load("/output/", {}, function(data) {
        // I want to extract the value of an element in data
    }); 
});

Content data:

<div>
  Something
</div>
<input type="hidden" name="ajax-output" value="100" />

I want to get the value ajax-outputfrom the output data. How can I do this using jQuery?

Answer 1

To get it directly, since it is in the root, you need .filter(), for example:

$(data).filter("input[name='ajax-output']").val();

Or get it from the one you just inserted (via .load()the call itself) with .find():

$(this).find("input[name='ajax-output']").val();

Answer 2

Place an invisible div inside the page with the id "invisibleDiv". Then, using the following code, you should get the ajax-output value:

$("#invisibleDiv").append(data);
var data = $("#invisibleDiv").find("input[name='ajax-output']").val();