AJAX的一个小问题，请教一下～

下面这段代码没有错，我还想加个小功能：就是在没有读取success前加一个滚动效果的GIF图片
比如说$('#div').html("<img src='./images/a.gif'>");
请问该加在代码的哪里呢？谢谢！

代码如下：
$.ajax({
    type: "GET",
    url: "__APP__/Fish/bait/user_id/{$p1user['id']}/item_id/"+$("#bait_select").val(),
    data: "",
    success: function(data){
        
        alert(data);
        $("#dialog1").dialog("close");
    }

});

$('#div').html("<img src='./images/a.gif'>");
$.ajax({
    type: "GET",
    url: "__APP__/Fish/bait/user_id/{$p1user['id']}/item_id/"+$("#bait_select").val(),
    data: "",
    success: function(data){
        $('#div').html("");

        alert(data);
        $("#dialog1").dialog("close");
    }

});

或
$.ajax({
    type: "GET",
    beforeSend:function(){ $('#div').html("<img src='./images/a.gif'>"); },
    url: "__APP__/Fish/bait/user_id/{$p1user['id']}/item_id/"+$("#bait_select").val(),
    data: "",
    success: function(data){
        $('#div').html("");

        alert(data);
        $("#dialog1").dialog("close");
    }

});
 

$("document").ready(function(){
$($"loading").hide();
$("#loading").ajaxStart(function(){$(this).show()};);
$("#loading").ajaxStop(function(){$(this).hide();});
});


<div id="loading"><img src="xxxxx.gif"></a>