Estoy usando una función Jquery Ajax para recuperar los datos de la base de datos, en caso de clic.

Esta función funciona bien y muestra los datos. Pero lleva tiempo cargar los datos, por lo que quiero poner una imagen de carga, mientras se obtienen los datos. Usé este método para hacer

<script type="text/javascript">
    jQuery(function($) {
        $(document).ready(function() {
            $("#imgs").hide();
            $(".letter").bind('click', function(){
                $("#imgs").fadeIn();
                var val = $(".letter").val;
                var site = '<?php echo site_url(); ?>';
                $.ajax({
                    url: site+'/wp-content/themes/premiumnews/newContent.php?letter='+$(this).html(), 
                    success:function(data){
                        $("#imgs").hide();
                        $("#content1").html(data);
                    }
                });
            });
        });
    });
</script>

Cuando hago clic en el botón, aparece la imagen de carga, pero después del éxito, la imagen debería desaparecer, en mi caso aún permanece allí

¿Está mal mi código? o he usado un método incorrecto?