title: Setting up an init function in jQuery
body: <p>Just a quick question here, I wanted to find out how I could set up these into an init() function then have the function run on document.ready.  This code is being used in a separate main.js file.  Does it need to be called from the index page?</p>
  
  <pre><code>$('#main_right_line_one').click(function(){
      $('#main_regular_layover, #main_deep_layover').fadeOut('slow', function(){
          $('#main_light_layover').fadeIn('slow');
      });
  });
  
  $('#main_right_line_two').click(function(){    
      $('#main_light_layover, #main_deep_layover').fadeOut('slow', function(){
          $('#main_regular_layover').fadeIn('slow');
      });
  });
  
  $('#main_right_line_three').click(function(){
      $('#main_light_layover, #main_regular_layover').fadeOut('slow', function(){
          $('#main_deep_layover').fadeIn('slow');
      });
  });
  </code></pre>
  
  <p>Any help is appreciated.  I'm really trying to wrap my head around this, but I can't seem to find any good tutorials that explain init() well enough for my specific code.</p>