title: .bind() jQuery isn't working for me
body: <p>For some reason my simple jquery bind event isn't working. The funny thing is that if I run it in the console of firebug twice it works, but it's very glitchy. Also, when I run it in the firebug console it says this: [Document www.mywebsite.com]</p>
  
  <p>(I placed jquery at bottom before <code>&lt;/body&gt;</code>)
  jquery: </p>
  
  <pre><code>&lt;script type="text/javascript"&gt; //steps highlighter
  $(function() {
      $("div.step_highlighter").bind("mouseover mouseleave", highlight);
  });
  
  function highlight(evt) {
      $("div.step_highlighter").toggleClass("step_highlighted");  
  }
  </code></pre>
  
  <p></p>
  
  <p>html:</p>
  
  <pre><code>&lt;div class="step_highlighter"&gt;
              &lt;div class="step_wrap"&gt;
                      &lt;h2 class="step_title"&gt; Step 1: &lt;/h2&gt;
                      &lt;p class="step"&gt; Determine which service we can help you with. &lt;/p&gt;
                      &lt;p class="sub_step"&gt;Web Design&lt;/p&gt;
                      &lt;p class="sub_step"&gt;Web Development&lt;/p&gt;
                      &lt;p class="sub_step"&gt;Graphic Design&lt;/p&gt;
                      &lt;p class="sub_step"&gt;Internet Marketing&lt;/p&gt;
              &lt;/div&gt;
          &lt;/div&gt;
  </code></pre>