Using Custom Javascript and pHp to send email to myself when a user clicks on an input button but only works on Chrome, IE, and Micorosft Edge

So turns out that on Safari and Firefox, the page would refresh before the email got sent out. As a workaround I just created another button that the user has to click on before clicking on the actual button that updates their profile information. The click event handler on that first button is being used to send out the information to the php file now. It solved the problem and now I’m getting emails no matter what browser the user is updating their profile from!

Heres’s the javascript:

(function($){

$(document).ready(function(){

// console.log('mailajax is enqueued, showing on firefox');

setTimeout(function(){

if($('html').hasClass('user-section')){
    // console.log('this is a user page');
    $('input.um-button').hide();
    $('.um-profile .um-col-alt .um-left.um-half').prepend('<a id="custom-update-btn">Approve Changes</a>');
}


var ogArray = new Array(),
    newArray = new Array(),
    dropOgArray = new Array(),
    dropNewArray = new Array(),
    difference,
    username = String($('.um-name').find('a').attr('title'));

function diffObject(a, b) {
  return Object.keys(a).reduce(function(map, k) {
    if (a[k] !== b[k]) map[k] = b[k];
    return map;
  }, {});
}

$('input.um-form-field').each(function() {

    var $key = $(this).closest('.um-field').find('label').text(),
        $value = $(this).val();

    ogArray[$key] = $value;

});

$('span.select2-chosen').each(function() {

    var $key = $(this).closest('.um-field').find('label').text(),
        $value = $(this).text();


    dropOgArray[$key] = $value;

});



$('input.um-form-field').on('keyup', function(){
    $('form').find('input.um-form-field').each(function() {

        var $key = $(this).closest('.um-field').find('label').text(),
            $value = $(this).val();

        newArray[$key] = $value;

    });

});

$('select.um-form-field').on('change', function(){
    setTimeout(function(){
        $('form').find('span.select2-chosen').each(function() {

            var $key = $(this).closest('.um-field').find('label').text(),
                $value = $(this).text();

            dropNewArray[$key] = $value;

        });

        // console.log(diffObject(dropOgArray, dropNewArray));


    }, 1000);


});



$('a#custom-update-btn').on('click', function(e){
    // console.log('update btn has been clicked on');

    var ajaxurl="http://www.reformeducators.org/wp-content/themes/NATE/admin-ajax.php",
                  stringDifference = JSON.stringify(diffObject(ogArray, newArray)),
                stringDropDifference = JSON.stringify(diffObject(dropOgArray, dropNewArray));       
    $.post(ajaxurl, { 'Name': username, 'Changes Made': stringDifference, 'Drop Menu Changes': stringDropDifference});

    $('a#custom-update-btn').hide();
    $('.um-profile-body .um-button').show();
});

}, 1000);







});

})(jQuery);