JSFiddle - React, Tailwind, and code Playground

by naureen1_

HTML

<script src="https://code.jquery.com/jquery-2.2.2.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css">
<div class="container">
  <a id="myBtn" href="#" class="btn btn-primary">One
</a>
  <a id="myBtn1" href="#" class="btn btn-primary">Two
</a>
  <a id="myBtn2" class="btn btn-primary" href="#">Three
</a>
  <!-- Modal -->
  <div id="myModal" class="modal fade">
    <div class="modal-dialog">
      <div class="modal-content">
        <div class="modal-body">
          <button type="button" class="close" data-dismiss="modal" aria-hidden="true">X</button>
          <iframe class="size" src="https://www.youtube.com/embed/rFuEu3dj-nA?autoplay=1" ;frameborder="0" allowfullscreen></iframe>
        </div>
      </div>
    </div>
  </div>
  <div id="myModal1" class="modal fade">
    <div class="modal-dialog">
      <div class="modal-content">
        <div class="modal-body">
          <button type="button" class="close" data-dismiss="modal" aria-hidden="true">X</button>
          <iframe class="size" src="https://www.youtube.com/embed/ZHfRHKbd_fE?autoplay=1" ;frameborder="0" allowfullscreen></iframe>
        </div>
      </div>
    </div>
  </div>
  <div id="myModal2" class="modal fade">
    <div class="modal-dialog">
      <div class="modal-content">
        <div class="modal-body">
          <button type="button" class="close" data-dismiss="modal" aria-hidden="true">X</button>
          <iframe class="size" src="https://www.youtube.com/embed/JCdfecir86Y?autoplay=1" ;frameborder="0" allowfullscreen></iframe>
        </div>
      </div>
    </div>
  </div>
</div>

JavaScript

$("#myBtn").click(function() {
  $("#myModal").modal({
    backdrop: false
  });
});

$("#myBtn1").click(function() {
  $("#myModal1").modal({
    backdrop: false
  });
});

$("#myBtn2").click(function() {
  $("#myModal2").modal({
    backdrop: false
  });
});