Question

This function works as it should,

window.setInterval(function(){
    var active = $('#frontpageControls a.active');
    var next = active.next().length > 0 ? active.next() : $('#frontpageControls .first'); 
        active.removeClass("active");
        next.addClass("active");
    var activeFPElement=$("#MainFrontpage li:visible");
    var nextFPElement = activeFPElement.next().length > 0 ? activeFPElement.next() : $('#MainFrontpage .first');
    activeFPElement.hide();
    nextFPElement.show();

        //alert($next.text());
    }, 5000);

However when i run the same commands in this

$("#frontpageArrows .right").bind("click", function() {
        var active = $('#frontpageControls a.active');
        var next = active.next().length > 0 ? active.next() :    $('#frontpageControls .first'); 
        active.removeClass("active");
        next.addClass("active");
        var activeFPElement=$("#MainFrontpage li:visible");
        console.log(activeFPElement+ " Fpelement ");
        var nextFPElement = $activeFPElement.next().length > 0 ? $activeFPElement.next() : $('#MainFrontpage .first');
        activeFPElement.hide();
        nextFPElement.show();
        return false;
    });

The function doesn’t run properly, and i get an error that the activeFPElement is undefined.
Can anyone help me as to why this function works as handler for setInterval but not for bind?

Thank you 🙂

Answer 1

$activeFPElement.next() should be activeFPElement.next().

You declared activeFPElement but you are using $activeFPElement.