Edit in JSFiddle

$(function () {
    $(document).ajaxStart(function () {
        $("#log").html("ajaxStart<hr/>");
    });

    $(document).ajaxSend(function (event, xhr, settings) {
        var html = "ajaxSend: url:" + settings.url + "<hr/>";
        $("#log").append(html);
    });

    $(document).ajaxSuccess(function (event, xhr, settings) {
        var html = "ajaxSuccess:<br/>";
        html += "url:" + settings.url + "<br/>";
        html += "readyState:" + xhr.readyState + "<br/>";
        html += "status:" + xhr.status + "<hr/>";
        console.log(xhr);
        $("#log").append(html);
    });

    $(document).ajaxError(function (event, xhr, settings, exception) {
        var html = "ajaxError:<br/>";
        html += "url:" + settings.url + "<br/>";
        html += "readyState:" + xhr.readyState + "<br/>";
        html += "status:" + xhr.status + "<hr/>";
        $("#log").append(html);
    });

    $(document).ajaxComplete(function (event, xhr, settings) {
        var html = "ajaxComplete:<br/>";
        html += "url:" + settings.url + "<br/>";
        html += "readyState:" + xhr.readyState + "<br/>";
        html += "status:" + xhr.status + "<br/>";
        html += "text:" + xhr.responseText + "<hr/>";
        $("#log").append(html);
    });

    $(document).ajaxStop(function () {
        $("#log").append("ajaxStop");
    });

    $("#btnAjax").click(function () {
        $.ajax({
            type: "POST",
            url: "/echo/html"
        });
    });
});
<input type="button" id="btnAjax" value="echo" />
<br />
<fieldset>
    <legend>Log</legend>
    <div id="log"></div>
    <br />
</fieldset>
<fieldset>
    <legend>Result</legend>
    <div id="result"></div>
    <br />
</fieldset>