Os vengo a molestar tengo la siguiente animación que desaparece en `x` segundos, pero no se está validando el cierre **[x]** quiero dar la posibilidad de cerrar el mensaje manualmente, pero no me está funcionando. <!-- begin snippet: js hide: false console: true babel: false --> <!-- language: lang-js --> $(document).ready(function() { $('.response').fadeIn(500).delay(6000).fadeOut(500); $(".dismiss").click(function(){ $(".response").fadeOut(500); }); }); <!-- language: lang-css --> .response { display: none; opacity: 0.9; position: absolute; bottom: 15px; left: 15px; margin: 0; padding: 0; width: 500px; } <!-- language: lang-html --> <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <div class="response"> <span class="dismiss">X</span> <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas non.</p> </div> <!-- end snippet --> **El error** Al adaptar la animación a la respuesta de `AJAX` de la siguiente manera el `div` de la animación se ejecuta automáticamente al refrescar la página o abrir directamente la página y no debe hacer así debido a que este se debe ejecutar solo si se recibe una petición o respuesta por medio de `ajax` **Ejemplo:** >Este es mi `AJAX` tomando ejemplos en la siguiente [fuente endeos](https://blog.endeos.com/usando-ajax-con-php-y-jquery/) $(document).ready(function() { $('.response').fadeIn(500).delay(6000).fadeOut(500); $(".dismiss").click(function(){ $(".response").fadeOut(500); }); }); $(document).ready(function() { $(document).on('submit', '#post', function() { var data = $(this).serialize(); $.ajax({ type : 'POST', url : 'post.php', data : data, success : function(data) { $(".response").html(data); } }); return false; }); }); Y obtengo respuesta <div class="response"><!-- Respuesta AJAX --></div>';