title: How to properly use jQuery scripts in Wordpress?
body: <p>I feel like I am definitely missing something simple here...  but for the life of me, can't find what I'm missing.    </p>
  
  <p>I am of the "bad habit" of including jQuery functions directly in the header.php file (among other spots).  This is frowned upon, as I understand, and functions should be kept in a separate file using the wp_enqueue function to load them (if I get that correctly).</p>
  
  <p>I'm attempting to following the solution given here:
  <a href="https://stackoverflow.com/questions/11159860/how-do-i-add-a-simple-jquery-script-to-wordpress">How do I add a simple jQuery script to WordPress?</a></p>
  
  <p>I have this simple function in my header.php that should fire on document ready:</p>
  
  <pre><code>&lt;script&gt;
      // Scroll to Top
      jQuery(document).ready(function () {
          // Force element to hidden state when page loads
          jQuery('.scroll-to-top').hide();
  
          // Check to see if the window is top if not then display button
          jQuery(window).scroll(function () {
              if (jQuery(this).scrollTop() &gt; 200) {
                  jQuery('.scroll-to-top').fadeIn();
              } else {
                  jQuery('.scroll-to-top').fadeOut();
              }
          });
          //Click event to scroll to top
          jQuery('.scroll-to-top').click(function () {
              jQuery('html, body').animate({ scrollTop: 0 }, 800);
              return false;
          });
      });
  &lt;/script&gt;
  </code></pre>
  
  <p>So to do things "correctly", I take my code out and placed it in myScripts.js (removing script tags of course).   In my functions.php file, I've added this code:</p>
  
  <pre><code>&lt;?php
      function add_my_script() {
          wp_enqueue_script(
              'myScripts', // name your script so that you can attach other scripts and de-register, etc.
              get_template_directory_uri() . '/js/myScripts.js', // this is the location of your script file
              array('jquery') // this array lists the scripts upon which your script depends
          );
      }
  
      add_action( 'wp_enqueue_scripts', 'add_my_script' );
  ?&gt;
  </code></pre>
  
  <p>But when I load my page, the script doesn't work anymore.</p>
  
  <p><strong>EDIT</strong></p>
  
  <p>Thanks for the help so far...  changing this line:</p>
  
  <pre><code>add_action( 'wp_enqueue_scripts', 'myScripts' );
  </code></pre>
  
  <p>to this:</p>
  
  <pre><code>add_action( 'wp_enqueue_scripts', 'add_my_script' );
  </code></pre>
  
  <p>resolved the error seen on the page.    </p>
  
  <p>Unfortunately, the code does not seem to fire off on the page any longer.   I assume because it's (document).ready it should be firing automatically (as it always did when I included it directly), but it doesn't when I include the script in this manner.   Ugh...  thoughts?</p>