Question

$("a.details")
    .click(function () {
    var $this = $(this);

    $this.parents(".subscription")
        .find('.plan-details')
        .stop(true, true)
        .animate({
        height: ['toggle', 'easeOutBounce']
    }, 'slow',

    function () {
        $this.text(function (i, text) {
            return text == 'View Details' ? 'Hide Details' : 'View Details';);
        }) ,

        function (e) {
            $this.parents(".subscription")
                .find('.plan-details')
                .stop(true, true)
                .animate({
                height: 'toggle'
            });

        });

fiddle: http://jsfiddle.net/6fCrd/

… not sure what am I doing wrong here, it doesn’t work. It should slide down with bounce effect and also change the trigger text.

Answer 1

there’s an syntax error here:

return text == 'View Details' ? 'Hide Details' : 'View Details';);
// ... and here
$this.text(function (i, text) {
        return text == 'View Details' ? 'Hide Details' : 'View Details';
}, function (e) {

EDIT

you must include jquery ui for animation effects

Try my demo: http://jsfiddle.net/6fCrd/7/