How to combine multiple jquery functions

Question

If you view the jquery code below you will see the famous $(document).ready(function(){ that starts the script off. I see this on pretty much all jquery code e

Answer 1

The problem is that you don't understand what the ready event is and why you need it.

Imagine that a page has not yet loaded fully and you try to change something on it with some javascript and since the code for that HTML element you are trying to manipulate is not even loaded yet, things go bad.

The ready event solves this problem. Any function (most often a single anonymous function) that you bind to the ready event gets executed as soon as all elements in the document are ready to be traversed and manipulated. It's considered bad practice to have any inline javascript. If you want an event(click,hover,etc) to work on your page, you should call it inside the $(document).ready() function.

And since a page only gets loaded once, any function that is bound to the ready event will only get called once. So there isn't much sense in binding multiple functions to the ready event. You can do everything in that one function that you bind to it. However it will cause no harm (as long as you understand what you are doing) since every function that you have bound to the ready event will be called once the DOM is ready.

I don't understand what you are trying to achieve by running that same piece of code five times... so I can't help you with that.

I hope that this explanation helps you solve your actual problem.