Zurb Joyride not following defined order

Question

Please review my Sample Fiddle...

When it initiates, it starts with the First Stop, and moves onto the Second and Third Stops. When it's ready to move onto the Fourth Stop, it skips and immediately jumps to a modal.

Everything is setup the way the documentation states.

This is the script to call the function...

  $(window).load(function() {
    $('#joyRideTipContent').joyride({
      autoStart : true,
      postStepCallback : function (index, tip) {
      if (index == 2) {
        $(this).joyride('set_li', false, 1);
      }
    },
    modal:true,
    expose: true
    });
  });

I'm completely lost as to why an item is completely skipped over.

Answer 1

You code works as expected if you remove the postStepCallback function:

postStepCallback : function (index, tip) {
      if (index == 2) {
        $(this).joyride('set_li', false, 1);
      }
    }

if you don't need it, don't use it.

Demo: http://jsfiddle.net/IrvinDominin/jeWTv/