Uncaught TypeError: Object [object Object] has no method 'apply'

Question

I am receiving this Uncaught TypeError on a new website I am creating, but I can't work out what is causing the error.

I have recreated the issue at the link below, if you take a look at your browsers JS console you'll see the error occurring, but nothing else happens.

http://jsfiddle.net/EbR6D/2/

Code:

$('.newsitem').hover(
$(this).children('.text').animate({ height: '34px' }), 
$(this).children('.text').animate({ height: '0px'  }));​

Answer 1

Be sure to wrap those in asynchronous callbacks:

$('.newsitem').hover(
    function() {
        $(this).children('.title').animate({height:'34px'});
    }, function() {
        $(this).children('.title').animate({height:'0px'});
    }
);
​

Answer 2

You need:

.hover(function(){ ... });

as per the documentation.

Answer 3

You're missing the function...

$('.newsitem').hover(
    $(this).children('.text').animate({height:'34px'}),
    $(this).children('.text').animate({height:'0px'})
);

To:

$('.newsitem').hover(function() {
    $(this).children('.text').animate({
        height: '34px'
    });
}, function() {
    $(this).children('.text').animate({
        height: '0px'
    });
});​
​

And the ​$(this).children('.text'), is not selecting anything.