Как мне объединить метод 'before' с методом 'fadeIn' в jQuery?

Question

У меня есть строка jquery, которая вставляет div перед другим div, который уже находится на странице с помощью метода before в jQuery:

$("#sendEmail").before('<div id="response"><h1>Success</h1><p>Your email was sent.</p></div>');

Я хочу, чтобы новый div исчез, поэтому я попытался объединить методы двумя разными способами, но оба не работали правильно. Вот что я попробовал:

$("#sendEmail").before('<div id="response"><h1>Success</h1><p>Your email was sent.</p></div>').fadeIn("slow");

Это не сработало, потому что он пытался скрыть div #sendmail, а не тот, который я вставлял. Вот еще одна попытка, которую я сделал:

$("#sendEmail").before('<div id="response"><h1>Success</h1><p>Your email was sent.</p></div>');                             

$("#response").fadeIn("slow");

Это также не сработало, так как div #response уже вставлен, когда я пытаюсь его добавить, поэтому ничего не происходит.

Я чувствую, что я действительно близко, но я не могу понять это. Может кто-нибудь помочь?

Answer 1

$('<div id="response"><h1>Success</h1><p>Your email was sent.</p></div>')
    .hide().insertAfter("#sendemail").fadeIn();

Answer 2

Попробуйте добавить дополнительный $ (), это вызовет createElement в ответе и добавит его. Затем он добавит элемент перед элементом sendEmail.

$("#sendEmail").before($('<div id="response"><h1>Success</h1><p>Your email was sent.</p></div>').fadeIn("slow"));

По сути, это то, к чему это расширено.

var responseDiv = $('<div id="response"><h1>Success</h1><p>Your email was sent.</p></div>')
  .fadeIn("slow");
$("#sendEmail").before(responseDiv);

Answer 3

установить правило css на #response для отображения: нет

тогда он не будет отображаться, пока вы не исчезнете