how to edit the alert success submission in JavaScript

Hi I am editing a website, there is the form submission there, where I use formspree to submit forms (names, email, comments). then click the send button.

Everything works well, expect the successful alert looks weird... see picture below:

I am trying to edit this, but couldn't figure out how. I want it to show "Thanks, your submission is successful!".

I found the javascript code for this part:

// Form Validation !Plugin @v1.0
    NioApp.Plugins.submitform = function () {
        var $form = $('.nk-form-submit');
        
        if( !$().validate && !$().ajaxSubmit ) {
            console.log('jQuery Form and Form Validate not Defined.');
            return true;
        }
        
        if ($form.exists()) {
            $form.each(function(){
                var $self = $(this), _result = $self.find('.form-results');
                $self.validate({
                    ignore: [],
                    invalidHandler: function () { _result.slideUp(400); },
                    submitHandler: function(form) {
                    _result.slideUp(400);
                    $(form).ajaxSubmit({
                        target: _result, dataType: 'json',
                        success: function(data) {
                            var type = (data.result==='error') ? 'alert-danger' : 'alert-success';
                            _result.removeClass( 'alert-danger alert-success' ).addClass( 'alert ' + type ).html(data.message).slideDown(400);
                            if (data.result !== 'error') { $(form).clearForm().find('input').removeClass('input-focused'); }
                        }
                    });
                    }
                });
                $self.find('.select').on('change', function() { $(this).valid(); });
            });
        }
    };
    NioApp.components.docReady.push(NioApp.Plugins.submitform);

and the code in css:

.alert-success { color: #29cf77; background: #cef5e1; }

.alert-success .close { background: #64e09e; }

.alert-success-alt { background: #39d884; }

.alert-success-alt .close { background: #25b96b; }

can anyone give me some hints how to change it? Thanks.

I will take a part of the javascript in the question to focus

                    $(form).ajaxSubmit({
                        target: _result, dataType: 'json',
                        success: function(data) {
                            var type = (data.result==='error') ? 'alert-danger' : 'alert-success';
                            _result.removeClass( 'alert-danger alert-success' ).addClass( 'alert ' + type ).html(data.message).slideDown(400);
                            if (data.result !== 'error') { $(form).clearForm().find('input').removeClass('input-focused'); }
                        }
                    });

This part is the ajax part, which is responsible to submit the data after validation, the return after successful submission is stored in the object data which has two attributes. data.result gives the submission status, and data.message carry the message to be displayed in a div. this div which has a class name .form-results, which is pointed by the object _result ( _result = $self.find('.form-results'))

The line below changes the class of the div according to data.status and display the message sent after submition

                            _result.removeClass( 'alert-danger alert-success' ).addClass( 'alert ' + type ).html(data.message).slideDown(400);

Therefore, either the message to be sent after submission or make a short modification for the case of success or failure.

if we go to make this modification, so just before mentioned line above we add:

if (data.result !== 'error') {data.message="Thanks, your submission is successful!";}
else { data.message = "Submition failed";}

so the code becomes

                    $(form).ajaxSubmit({
                        target: _result, dataType: 'json',
                        success: function(data) {
                            var type = (data.result==='error') ? 'alert-danger' : 'alert-success';
                             /////////////////////////////////////////////
                             if (data.result !== 'error') {data.message="Thanks, your submission is successful!";}
                             else { data.message = "Submition failed";}
                             //////////////////////////////////////////////
                            _result.removeClass( 'alert-danger alert-success' ).addClass( 'alert ' + type ).html(data.message).slideDown(400);
                            if (data.result !== 'error') { $(form).clearForm().find('input').removeClass('input-focused'); }
                        }
                    });

as clear now it is not important to get the solution but also so important to understand the code.