Не могу вывести попап, после отправки формы на сайте. Форма на Contact Form 7

<div class="fancybox-hidden" style="display: none;">          
    <div id="popup_msg" class="container hw pt-5">
        <div class="row justify-content-center pb-4">
            <div class="col-1 align-self-center">
                <img src="sent.svg" alt="">
            </div>
        </div>
        <div class="row justify-content-center pb-4">
            <div class="col align-self-center">
                <h2 class="text-prim">Thanks, your application has been<br> sent, we will contact you</h2>
            </div>
        </div>

        <div class="row justify-content-center pb-4">
            <div class="col-1 align-self-center">
                <button class="popup-btn btn btn-primary">OK</button>
            </div>
        </div>
    </div>
</div>

Это сам попап

<script type="text/javascript">
jQuery(document).ready(function($) {
            ddocument.addEventListener( 'wpcf7mailsent', function( event ) {
      var id = event.detail.contactFormId;
      if ( id == 61|| id == 1961 ) {
        $.fancybox({href: '#popup_msg'});
      }
    }, false );
});
</script>

это скрипт который должен по идее показывать попап, после успешной отправки. Дефолтное сообщение об успешной отправке работает. И форма на почту приходит