Question

I am trying to load this javascript externally, but it seems to not be working? Is there a reason for this?

I have been reading around, and I am loading jquery first before everything. But when calling out to these functions they will not load.

$(document).ready(function () {
  //add span to numbers
  var elem = document.getElementById('passage');
  elem.innerHTML = elem.innerHTML.replace(/\b(\d+)\b/g, '<span>$1</span>');

  //menu toggle     
  $("#social-wrap li:nth-child(6)").click(function () {
    $("#phone-nav").slideToggle("slow");
  });

  //nav slideDown      
  $('#main-nav li').hover(function () {
    //show its submenu
    $('ul', this).slideDown(100);
  }, function () {
    //hide its submenu
    $('ul', this).slideUp(100);
  });

  //show/hide countdown  
  $('#show').click(function () {
    $('#countdown').slideDown('slow');
    return false;
  });

  $('#hide').click(function () {
    $('#countdown').slideUp('fast');
    return false;
  });

  $('#hide,#show').click(function () {
    $('#hide,#show').toggle();
  })

});

EDIT

Here is the link to the wordpress theme I am building: http://beta.revival.tv/
As well as the JS file: http://beta.revival.tv/wp-content/themes/revival-theme/lib/scripts/main.js?ver=1.1
Sorry for how messy the site is, still working on it.

Answer 1

For one, I have heard that WordPress messes with the $ shorthand for JQuery. You may be able to wrap your code in something like this in order to be able to use the $ shorthand. Otherwise try using the full jQuery() instead of $().

( function( $ ) {
   // allows you to use $ inside of this wrapper.

} )( jQuery );

Also, how are you adding jQuery to your theme?

http://wordpress.org/support/topic/how-do-you-get-jquery-to-work-in-wordpress