title: jQuery not working in Wordpress 3.5
body: <p>So I seem to have an issue with one of my old Wordpress themes. I just brought one of my themes out of the darkness to use as a piece of my portfolio, and immediately realized that my jQuery sidebar has completely stopped working and I'm not sure why. Now mind you, I wrote this bit of sidebar code before WordPress implemented their own 'custom' sidebar implementations (so I'm very unsure if this relates to that but highly doubt it. I think I developed it around the time of Wordpress 3.1). The specific code at fault is located here</p>
  
  <pre><code>&lt;script src="//ajax.googleapis.com/ajax/libs/jquery/1.5.2/jquery.js" type="text/javascript"&gt;&lt;/script&gt;
  &lt;script type="text/javascript" src="js/sliding_effect.js"&gt;&lt;/script&gt; &lt;!-- code for jquery menu --&gt;
  
  &lt;?php wp_head(); ?&gt;  
  
  &lt;script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js"&gt;&lt;/script&gt;
  &lt;script type="text/javascript"&gt;
  
  $(document).ready(function()
  {
      $(".button-slide").click(function()
      {
          $("#slide-panel").slideToggle("slow");
      });
  });
  
  &lt;/script&gt;
  
  &lt;/head&gt;  
  </code></pre>
  
  <p>I know the jQuery version is out of date, but even after updating it I was still unsuccessful. Does anyone have a clue on what I am doing wrong. I'll happily provide more code if needed. All of the above is located in my header.php file within my theme.</p>
  
  <p>Here's a portion of the implementation </p>
  
  <pre><code>&lt;ul id="sliding-navigation"&gt;
  
  &lt;br/&gt;
  
  
  
  
  &lt;!-- Panel --&gt;
  
  &lt;li class= "sliding-element"&gt;&lt;a href="http://www.facebook.com/pages/TheEntertainmentArt/208687212498902" target="_TOP" " title="TheEntertainmentArt"&gt;Join Us On Facebook!&lt;/a&gt;&lt;/li&gt;
  
       &lt;li class="sliding-element"&gt;&lt;h3&gt;Menu&lt;/h3&gt;&lt;/li&gt;
  
       &lt;li class="sliding-element"&gt;&lt;a href= "http://theentertainmentart.info/category/ps3"&gt;Playstation 3&lt;/a&gt;&lt;/li&gt;
       &lt;li class="sliding-element"&gt;&lt;a href= "http://theentertainmentart.info/category/360"&gt;Xbox 360&lt;/a&gt;&lt;/li&gt;
       &lt;li class="sliding-element"&gt;&lt;a href= "http://theentertainmentart.info/category/wii"&gt;Wii&lt;/a&gt;&lt;/li&gt;
       &lt;li class="sliding-element"&gt;&lt;a href= "http://theentertainmentart.info/category/film"&gt;Film&lt;/a&gt;&lt;/li&gt;
       &lt;li class="sliding-element"&gt;&lt;a href= "http://theentertainmentart.info/category/music"&gt;Music&lt;/a&gt;&lt;/li&gt;
       &lt;li class="sliding-element"&gt;&lt;a href= "http://theentertainmentart.info/category/art"&gt;Art&lt;/a&gt;&lt;/li&gt;
       &lt;li class="sliding-element"&gt;&lt;a href= "http://theentertainmentart.info/category/coding"&gt;Coding&lt;/a&gt;&lt;/li&gt;
        &lt;li class="sliding-element"&gt;&lt;a href= "http://theentertainmentart.info/category/uncategorized"&gt;Misc&lt;/a&gt;&lt;/li&gt;
  </code></pre>
  
  <p>and some CSS</p>
  
  <pre><code>  #navigation-block {
          position:relative;
          /*top:100px;
          left:100px;*/
      }
  
      #hide {
          position:absolute;
          top:30px;
          left:-190px;
      }
  
      ul#sliding-navigation
      {
  
          list-style: none;
          /*font-size: .75em;*/
          font-size: 1em;
          /*margin: 30px 0;*/
          padding: 0;
          width: 175px;
  
  
  
      }
  ul#sliding-navigation li.sliding-element h3,
  ul#sliding-navigation li.sliding-element a
  {
      display: block;
      width: 175px;
  
      padding: 5px 10px;
      margin: 0;
      margin-bottom: 5px;
      /* corner code */
      /*border-bottom-right-radius: 50px;
      border-top-right-radius: 50px;
      border-top-left-radius: 50px;
      -moz-border-radius-topright: 50px;
      -moz-border-radius-topleft: 50px;
      -moz-border-radius-bottomright: 50px;*/
      -moz-border-radius: 1em 4em 1em 4em;
      border-radius: 1em 4em 1em 4em;
      border: outset;
  
  
  }
  </code></pre>
  
  <p>sliding_effect.js</p>
  
  <pre><code>$(document).ready(function()
  {
      slide("#sliding-navigation", 25, 15, 150, .8);
  });
  
  function slide(navigation_id, pad_out, pad_in, time, multiplier)
  {
      // creates the target paths
      var list_elements = navigation_id + " li.sliding-element";
      var link_elements = list_elements + " a";
  
      // initiates the timer used for the sliding animation
      var timer = 0;
  
      // creates the slide animation for all list elements 
      $(list_elements).each(function(i)
      {
          // margin left = - ([width of element] + [total vertical padding of element])
          $(this).css("margin-left","-180px");
          // updates timer
          timer = (timer*multiplier + time);
          $(this).animate({ marginLeft: "0" }, timer);
          $(this).animate({ marginLeft: "15px" }, timer);
          $(this).animate({ marginLeft: "0" }, timer);
      });
  
      // creates the hover-slide effect for all link elements         
      $(link_elements).each(function(i)
      {
          $(this).hover(
          function()
          {
              $(this).animate({ paddingLeft: pad_out }, 150);
          },      
          function()
          {
              $(this).animate({ paddingLeft: pad_in }, 150);
          });
      });
  }
  </code></pre>