AJAX error handling with jQuery

HTML

<h1>AJAX error handling with jQuery</h1>

<div>
    <button id="myBtnAjax">AJAX communication with error</button>
</div>

<div id="result">
</div>

JavaScript

$(document).ready(function() {

    $('#myBtnAjax').click(function() {

        /**
         * http://api.jquery.com/jQuery.ajax/
         */
        $.ajax({
            url: '/non-existent-path-adsasd',

            type: "GET",

            dataType: "json",

            data: {
                name: "John",
                location: "Boston"
            },

            /**
             * A function to be called if the request fails. 
             */
            error: function(jqXHR, textStatus, errorThrown) {
                alert('An error occurred... Look at the console (F12 or Ctrl+Shift+I, Console tab) for more information!');

                
                console.log('jqXHR:');
                console.log(jqXHR);
                console.log('textStatus:');
                console.log(textStatus);
                console.log('errorThrown:');
                console.log(errorThrown);
            },

            /**
             * A function to be called if the request succeeds.
             */
            success: function(data, textStatus, jqXHR) {
                $('#result').html(data);
                alert('Load was performed. Look at the console (F12 or Ctrl+Shift+I, Console tab) for more information! ');
                console.log('jqXHR:');
                console.log(jqXHR);
                console.log('textStatus:');
                console.log(textStatus);
                console.log('data:');
                console.log(data);
            }
        });

    });

});

///////////////////////////////////////////////////////////