Question

How do you go about writing out HTML to the calling position of a jQuery function?

I have an HTML page that contains the following jQuery/JS code:

... HTML contents ...
 <script>
   functionName();
 </script>
... More HTML Contents... 

How do I get functionName to append/write out new content where it is called, rather than selecting another ID in the document and appending after.

JavaScript’s document.write can do this, however, I’ve read that it screws up jQuery’s ability to work with the DOM later.

Answer 1

Inspired by this answer.

It appears that scripts are run in order, so at the time of calling, the last script tag at that very moment is the script tag which contains that call.

http://jsfiddle.net/vYPHb/2/

function test() {
    // get last script tag at the point of calling - useful case of
    // explicitly NOT using '$(document).ready' :)

    $("script:last").replaceWith("hacked");
}

HTML:

foo

<script>
    test();
</script>

bar