help.js

$(function () {

    var dot,
        tooltip;

    var help = function (steps) {
        dot = dot || $('<div class="dot">').appendTo('body');
        tooltip = tooltip || $('<div class="tooltip">').hide().appendTo('body');
        steps = steps.slice();

        if (steps.length) {
            var step = steps.shift(),
                element = $(step.selector),
                offset = element.offset(),
                buttonLabel = steps.length ? 'Continue' : 'Done';

            tooltip.html('<p>' + step.message + '</p><div><a href="#" class="btn btn-primary btn-xs js-continue">' + buttonLabel + '</a></div>');
            tooltip.css({
                top: offset.top,
                left: offset.left + element.width() + 40
            });

            dot.animate({
                top: offset.top,
                left: offset.left + element.width() + 15
            }, function () {
                tooltip.show();
            });

            tooltip.find('.btn').click(function () {
                tooltip.hide();
                help(steps);
                return false;
            });
        } else {
            dot.hide();
            tooltip.hide();
        }
    };

    setTimeout(function () {
        var baseHelpSteps = [
            { selector: '#enroll-zip-input', message: 'Input zip value here to proceed further' },
            { selector: 'form button[type=submit]', message: 'Go and enrol your classes' },
            { selector: 'a[href="#outside-of-us-and-canada-info"]', message: 'If you outside of US or Canada - check our special international proposals' }
        ];

        help(baseHelpSteps);
    }, 100);
});