JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" type="text/css" href="https://odhelp.blob.core.windows.net/content/artifacts/css/foundation.min.css" />
<script src="https://odhelp.blob.core.windows.net/content/artifacts/js/foundation.min.js"></script>
  <script src="https://odhelp.blob.core.windows.net/content/artifacts/js/foundation/foundation.reveal.js"></script>

<div data-reveal class="reveal-modal" id="videoModal">
  <h2>This should have iframe</h2>
  <div class="flex-video" style="display: block;">
      <iframe width="420" height="315" frameborder="0" allowfullscreen="" src="http://www.apple.com/" data-src="https://www.google.com"></iframe>
  </div>

  <a class="close-reveal-modal">×</a>
</div>        <a class="radius button" data-reveal-id="videoModal" href="#">Example Modal w/Video…</a>

JavaScript

$(document).foundation();