Why isn't my javascript function defined for this function?

Question

This is very consistent, but firebug is showing that my saveForm function is not being defined form my 'button.save' event handler, but it works for my 'button.deleteForm' event handler:

    function saveForm(form)
    {

        var $form = form;
        var url = $form.attr('action');

        $.ajax({
               type: "POST",
               enctype: 'mutipart/form-data',
               url: url,
               data: $form.serialize(), // serializes the form's elements.
               success: function(data)
               {
                    // data is the server response.
                    // change this function to tell the
                    // user whether their submission 
                    // is correct or what fields have
                    // bad data.
                    var response = JSON.parse(data);
                    return true;
               }
             });
        return false; // avoid to execute the actual submit of the form.
    }

    // Do not use event handlers like .click(). This is the
    // only viable solution for handling events on dynamically
    // generated HTML elements. This handles the saving of data
    // to the server.
    $(document).on('click', 'button.save', function(e){
        var $form = $(this).closest('form'); 
        saveForm(form);            
    });

    // This event handler is responsible for deleting data.
    // For Joey's job: Please make sure that this calls save
    // after the user hits delete. This will save the data in
    // the database.
    $(document).on('click', 'button.deleteForm', function(e){

        // Get the form to update before deleting our embedded form
        var $form = $(this).closest('form');
        var str = $(this).attr('id');

        // Get the table id in review to delete
        var deleteForm = str + '_review';
        $('table#' + deleteForm).remove();

        // Get the collection form id to delete
        var idArray = str.split('_');
        idArray.pop();
        divId = '#' + idArray.join('_');
        $(divId).remove();

        saveForm($form);
    });

Answer 1

you missed $ in saveform

$(document).on('click', 'button.save', function(e){
    var $form = $(this).closest('form'); 
    saveForm($form);  
     //------^----here          
});