Firebug says jQuery is loaded but $() and jQuery() are not defined

Question

I'm trying to test my wordpress page with some simple jQuery script but it won't work.

I've loaded the script with wp_enqueue_script('jquery'); in functions.php as explained in the wordpress guide but something's buggy.

I'm testing the page using FireBug installed in Firefox 4 and if I take a look to the loaded scripts list it's all ok, but it also return me the error jQuery is not defined too.

I've followed the instructions on the noConflict mode but it still won't work for me:

// functions.php
<?php
    function init_scripts () {
        if (!is_admin()) {
            wp_enqueue_script('jquery');
        } 
    }
    add_action('init', 'init_scripts');
?>

// header.php
<script type="text/javascript">
    (function($) {
        $(document).ready(function() {
            alert('hello?');
        });
    }(jQuery));
</script>

Where I'm wrong?

I've tried this tutorial too and it's says jQuery object is not defined here:

// jquery from ajax.googleapis.com is correctly loaded
$j=jQuery.noConflict(); // firebug says jQuery is not defined by here

$j(document).ready(function(){
    alert('test');
});

Answer 1

jQuery needs to be outside the wrapper like so:

<script type="text/javascript">
(function($) {
    $(document).ready(function() {
        alert('hello?');
    });
})(jQuery);
</script>

Edit:

A better way would be:

jQuery(document).ready(function($) {
// $() will work as an alias for jQuery() inside of this function
});

Also make sure any inline script tags are AFTER your call to wp_head();

And even better way:

Instead of adding your script tags inline create a functions.js file containing all your extra functions etc. Enqueue it with jQuery as a dependency.

add_action( 'template_redirect', 'c3m_enqueue_scripts' );
function c3m_enqueue_scripts() {
    wp_register_script( 'custom-functions', TEMPLATEPATH .'/path/to/functions.js', array( 'jquery' ) TRUE);
    wp_enqueue_script( 'jquery' );
    wp_enqueue_script( 'custom-functions' );
}

Answer 2

Your init call is correct, it will load jQuery where the wp_head() call is in your header.php file.

after the wp_head() call in your header.php file, add:

<script type="text/javascript">
  jQuery(document).ready(function($){
    alert('hello?');
  });
</script>

placing the $ inside the function() section will allow you to use the regular $ with no conflicts.