When loading jQuery script into your web page as the browser brings it up on the screen, you need to place the code inside $(document).ready().

    $(document).ready(function()  {
        // Your code goes here

You want the codes to load after the elements on the page have finished loading.

This is partially because your jQuery code likely refers to elements on the page for manipulation. If the code started running before these elements were present, things would not work properly.

.ready(); is a jQuery method.

document is the DOM object for the entire web page document.

function({...}) is the set of instructions that should occur with the event occurs.

All of the jQuery code needs to go inside the {...} brackets for the function. If you do not have these lines of code, your script will not run properly.