Eventos global de Ajax no muestra por 2da vez imagen de carga

[skyz]

Saludos comunidad, tengo el siguiente problema,

estoy probando como realizar la carga de una imagen cuando se utiliza ajax, en un proceso complejo, pero la segunda vez que apreto el boton la imagen ya no se muestra si no se muestra en blanco.

Codigo JQuery:

Código:

<script type="text/javascript">
        $(document).ready(function () {

            //Eventos Globales para Ajax
            $(document).bind("ajaxSend", function () {

                $("#resultado").html($('#carga').show());

            }).bind("ajaxComplete", function () {

                $('#carga').hide();

            });

            $('#btnCarga').click(function () {
                $.ajax({

                    url: 'EfectoCargaAjax2.aspx/DevuelveCadena',

                    data: '{valor:"hola"}',

                    type: 'POST',

                    dataType: 'json',

                    contentType: "application/json; charset=utf-8"

                }).done(function(data){
                    
                    var Valor = data.d;

                    console.log(Valor);

                    $('#resultado').html(Valor);
                }).fail(onError);


            });

            function onError(jqXHR, textStatus) {
                alert(jQuery.parseJSON(jqXHR.responseText).Message);
            }
        });
    </script>

Codigo HTML:

Código:

<form id="form1" action="EfectoCargaAjax2.aspx" method="post">
    <h1>Efecto de Carga 2 Ajax</h1>
    <input type="button" id="btnCarga" value="Carga" />
    <div id="resultado">
        <p>Esperando que cargue la imagen</p>
    </div>
    <div id="carga" class="oculta">
        <p><img src="images/ajax-loader.gif" /></p>
    </div>
    </form>

Codigo CSS:

Código:

.oculta
{
    display:none;
}

Gracias por su tiempo.

[skyz]

Ya lo solucione habia que clonar el elemento img, porque cuando se sobreescribe con hola desaparece del DOM:

Código:

//Eventos Globales para Ajax
            $(document).bind("ajaxSend", function () {

                $copiaimagen = $('#carga').find('p').clone();

                $("#resultado").html($copiaimagen.show());

            }).bind("ajaxComplete", function () {

                $('#resultado').find('p').hide();

            });