Question

So I understand that if I have to place this code

$("#MyButton").click(function(){/* code goes here */});

in an external .js file, I have to reference the script

<script src="MyScript.js" type="text/javascript"></script>
</body>

just before closing the body tag (and not in head) otherwise it doesn’t work because the DOM has to be fully loaded before MyScript.js

BUT including my entire code in

$(function(){
    $("#MyButton").click(function(){/* code goes here */});
});

somehow makes it all work EVEN THOUGH I place the script now in HEAD (instead of just before closing body tag, like earlier)!!

How come??

Answer 1

Because $(f) is shortcut for “execute function f when dom is ready”