Ajax - Carregar o gif do loading na requisiçao, com botao de chamada..

$('#botaoX').live('click', function(e) {

$.ajax( {

type : "POST",

url : location.href,

success : function(result) {
$('#div-content-ingressos').html(result);

},
beforeSend : function() {
$('.refreshzinho').css( {display : "block"});
},
complete: function(){
 $('.refreshzinho').css({ display:"none" });
 },

error : function(XMLHttpRequest, textStatus, errorThrown) {
alert(textStatus);

}
});

Entao, o meu codigo é esse acima..

Eu gostaria que ao clicar em um botão que fica na parte debaixo da página (id botaox) ele fizesse a requisicao ajax e carregasse o result na div div-content-ingressos.

Isso funciona.

O problema é que eu queria que enquanto nao voltasse a requisicao ajax, ficasse um loading aparecendo no lugar.. O loading eu coloquei o nome de refreshzinho, coloquei no codigo, mas ele nao ta aparecendo no lugar certo.. podem me ajudar , por favor ?