Как присвоить display: none для класса в определеной форме (Contact Form 7) при нажатии на submit?

Question

[xanzik312]

Здравствуйте.
Задача была такая: после отправки формы показывать сообщение об успешной отправки(со своими
картинками/текстом и т.д).

Я в CF7 создал несколько форм добавил все что нужно, и добавил в их код .success с нужным сообщением.
Все работает вроде бы работает, но проблема в том, что при отправки одной формы, во всех остальных тоже открывается это сообщение.

Как сделать чтобы код выполнялся только для определеной формы в которой было нажато на кнопку submit?

document.addEventListener( 'wpcf7submit', function( event ) {
	$('.form__wrapp').css('display', 'none');
	$('.wpcf7-response-output').css('display', 'none');
	$('.success').css('display', 'block');
}, false );

(Посмотрел в DevTools у каждой формы добавляется .wpcf7 как wrapper)

Answer 1

[FKV]

document.addEventListener( 'wpcf7submit', function( event ) {
    $('.form__wrapp').css('display', 'none');
    $('.wpcf7-response-output').css('display', 'none');
    event.target.querySelector('.success').style.display = 'block';
}, false );