Question

I’m loading some HTML from a file via AJAX, trying extra a block from and eval it (a dynamic HTML/JS load).

The AJAX call is:

$.ajax({
          url: 'module.html',
          type: 'GET',
          complete: function(xhr, textStatus) {
            //called when complete
          },
          success: function(data, textStatus, xhr) {

            var jqData = $(data);
            var scriptNode = jqData.find("#startScript");
            if (scriptNode.length > 0)
            {
                $.globalEval(scriptNode.html());
            }
            ....

The HTML being loaded is:

<script type="text/javascript" id="startScript">
    $("#submitButton").button();
</script>

I can see the HTML is being loaded successfully in the AJAX call, and the jqData variable is showing an array of 3 nodes ([0] being the script node). But when I call the jqData.find(“#startScript”), the return is always null. Any ideas?

Answer 1

find searches within a node, so you can’t really use it to find a top node.

You might have better luck with closest which searches parents and self:

jqData.closest('#startScript')