jQuery page structure best practices for use of $(document).ready(function(){})
===

I currently have a lot of widgets on my website that do all sorts of jquery functions, animations, ajax calls etc.  I have been reading online that it is good practice to try to bundle your js into one file when you can or when it makes sense.  Each of my widgets are widely used on my website so it seems like it would make sense to put all the jquery/javascript for these widgets into one file.  Now, if I have `$(document).ready(function(){})` for everytime I want to invoke a widget's buttons, automatically load some data on doc ready, etc. what would be the best practice for doing this?  Not every widget is on every page, so if everything was in one javascript file, would invoking dom elements that are non existent be bad practice?

I guess I am really having trouble seeing the best way to structure my jquery/javascript around my web application to provide best performance. 