点击iFrame容器div

Question

我正在尝试检查是否已单击iFrame以隐藏覆盖在其顶部的div。我以为我能够检查我放在iFrame周围的div是否已被点击然后关闭我的代码，但它似乎不起作用。

这是我到目前为止的代码。

我正在使用wp_oembed_get();来显示iframe中的嵌入视频。

$('.fitvid').on('click', function() {
    if( $('.video-title').is(':visible') ) {
        $('.video-title').fadeOut('2000');
        $('.fitvid').addClass('playing');
    } else {
        $('.video-title').fadeIn('2000');
        $('.fitvid').removeClass('playing');
    }
});

有什么想法吗？

[编辑]

根据要求，我的HTML如下：

<div class="fitvid">
    <div class="home-video-container">
        <?php
            $embed = get_post_meta( get_the_ID(), '_ht_pf_video_oembed', true );
            echo wp_oembed_get($embed);
        ?>
    </div>

    <div class="perfect text-center video-title">
        <h1><?php the_title(); ?></h1>
    </div>
    <div class="format-icon">
        <span class="fa fa-youtube-play fa-2x"></span>
    </div>
</div>

我注意到，如果我点击视频标题div，它会运行JS，但点击实际的iFrame不会运行它。因此，如果我暂停视频，标题就不会再出现了。