title: Launch modal when div rectangle clicked
body: <p>I am trying to leverage the following modal example <a href="https://codepen.io/centem/pen/wrYeMV" rel="nofollow noreferrer">https://codepen.io/centem/pen/wrYeMV</a> but instead of using a button to launch the modal I am trying to launch the modal when a div rectangle is clicked and capture its id before launching the modal. This is the pen with the rectangles. <a href="https://codepen.io/centem/pen/GQVGmw" rel="nofollow noreferrer">https://codepen.io/centem/pen/GQVGmw</a> </p>
  
  <p>This is the modal javascript from the example I am trying to borrow from:</p>
  
  <pre><code>// Get the modal
  var modal = document.getElementById('myModal');
  
  // Get the button that opens the modal
  var btn = document.getElementById("myBtn");
  
  // Get the &lt;span&gt; element that closes the modal
  var span = document.getElementsByClassName("close")[0];
  
  // When the user clicks the button, open the modal 
  btn.onclick = function() {
      modal.style.display = "block";
  }
  
  // When the user clicks on &lt;span&gt; (x), close the modal
  span.onclick = function() {
      modal.style.display = "none";
  }
  
  // When the user clicks anywhere outside of the modal, close it
  window.onclick = function(event) {
      if (event.target == modal) {
          modal.style.display = "none";
      }
  }
  </code></pre>