title: Foundation Reveal Modal will not close
body: <p>While trying to create a modal using Foundation Reveal, I found that I couldn't close it. Not by using the reveal-modal-close class, not by javascript, nothing was working.</p>
  
  <p>I tried to put this example from the documentation into the page:</p>
  
  <pre><code>&lt;div id="myModal" class="reveal-modal" data-reveal&gt;
    &lt;h2&gt;Awesome. I have it.&lt;/h2&gt;
    &lt;p class="lead"&gt;Your couch.  It is mine.&lt;/p&gt;
    &lt;p&gt;I'm a cool paragraph that lives inside of an even cooler modal. Wins!&lt;/p&gt;
    &lt;a class="close-reveal-modal"&gt;&amp;#215;&lt;/a&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>When the page loads, it's open, but I can't get it to close. Also, not sure why it loads open. </p>
  
  <p>At the bottom of my <code>&lt;body&gt;</code>, I have this:</p>
  
  <pre><code>&lt;script src="//ajax.aspnetcdn.com/ajax/modernizr/modernizr-2.6.2.js"&gt;&lt;/script&gt;
  &lt;script src="//ajax.aspnetcdn.com/ajax/jQuery/jquery-1.10.2.min.js"&gt;&lt;/script&gt; 
  &lt;script src="//cdnjs.cloudflare.com/ajax/libs/foundation/5.3.1/js/foundation.min.js"&gt;      &lt;/script&gt;
  &lt;script src="//cdnjs.cloudflare.com/ajax/libs/foundation/5.3.1/js/foundation/foundation.reveal.js"&gt;&lt;/script&gt;
  &lt;script src="//cdnjs.cloudflare.com/ajax/libs/flexslider/2.2.2/jquery.flexslider-min.js"&gt;&lt;/script&gt;
  &lt;script src="//code.jquery.com/ui/1.10.3/jquery-ui.min.js"&gt;&lt;/script&gt;
  &lt;script src="js/smooth-scroll.js"&gt;&lt;/script&gt;
  &lt;script type="text/js" src="js/modal.js"&gt;&lt;/script&gt;
  
  &lt;script&gt;
    $(document).foundation();  
  &lt;/script&gt;
  </code></pre>