Use jQuery's .on() with Modernizr.prefixed()

Question

I just try to understand a jQuery-Script which I must use.
Now I found the following snip:

$currPage.addClass( outClass ).on( animEndEventName, function() {
    $currPage.off( animEndEventName );
    endCurrPage = true;
    if( endNextPage ) {
        onEndAnimation( $currPage, $nextPage );
    }
});

Explenation what I already know:
$currPage: This is the current page. It's a <div class="page">
endCurrPage: This is a boolean which is in standard false
endNextPage: Is similar to the endCurrPage

My question is the .on( animEndEventName, part. The animEndEventName variable looks like that:

var animEndEventNames = {
    'WebkitAnimation' : 'webkitAnimationEnd',
    'OAnimation' : 'oAnimationEnd',
    'msAnimation' : 'MSAnimationEnd',
    'animation' : 'animationend'
},
animEndEventName = animEndEventNames[ Modernizr.prefixed( 'animation' ) ];

This code is by Modernizr.prefixed(): http://modernizr.com/docs/#prefixed

jQuery's .on() wait for an event, here animEndEventName. So how this actually works? I don't understand exactly this part...

I hope You can help me. If you need more code, just say it. But I think this is the relevant part.

EDIT:
here is the full script on github by codrops https://github.com/codrops/PageTransitions/blob/master/js/pagetransitions.js

Answer 1

.on() takes a string with the name of an event to add a handler to.

It cannot know or care whether you pass that string from a variable or a string literal.