Retrieving the current step label from Fuelux Wizard

I am creating a fuelux wizard dynamically

My code is like this:

var CutRoadArray = [
            ['Location', '_Location'],
            ['Applicant Info', '_ApplicantInfo'],
            ['Details', '_ApplicationDetails'],
            ['Bond Info', '_BondInfo'],
            ['Attachments', '_Attachments'],
            ['Review', '_ReviewA']
        ];

   function AddStepToWizard(labelname, partialviewname) {
            $("#ApplicationWizard").wizard("addSteps", 0, [
                {
                    label: labelname,
                    pane: '<div partial-view-name="' + partialviewname + '" class="dynamicTabs"></div>'
                }
            ]);
        }

This works just fine, however the array itself is dynamic and the steps may be in different orders based on selections made along the way. I want to hit a certain function when a user navigates to the pane using the "back" or "forward" button. I can tap into the

$('#MyWizard').on('stepclick', function(e, data) {

I am thinking somehow check if the pane is equal to a value eg "location" then I will fire the function. But I am not able to get access to this text.

Any ideas will be much appreciated.

a little hacky, but this works

https://jsfiddle.net/qct3sdr1/2/

$('#myWizard').on('actionclicked.fu.wizard', function (evt, data) {
    var index = data.step;
    if(data.direction === 'next')
        index += 1;
    else
        index -= 1;
    var label = $('li[data-step="'+index+'"]').data('name');
    console.log("this is the current step label", label);
});