Foundation 5 AJAX揭示

I'm trying to get content loaded into a modal via ajax. Luckily Foundation 5 has just what I need but there's an issue. If I create a modal with the actual content, loaded in the socialModal div, it loads fine but when I try to load content via ajax, the screen dims as it should but the modal never appears.

Hitting the escape key does not remove the dim screen overlay either, I need to reload the page.

Any ideas as to what's causing this?

 <ul>
    <li><a href="http://twitter.com/intent/tweet?url=<?php the_permalink();?>&text=The Tweet" title="Tweet This Idea" data-reveal-id="socialModal" data-reveal-ajax="true"><span class="icon-twitter"></span></a></li>
    <li><a href="http://www.facebook.com/sharer/sharer.php?s=100&p[url]=<?php the_permalink();?>&p[title]<?php echo get_the_title();?>&p[summary]=<?php echo get_the_excerpt();?>" title="Add This Idea To Facebook" data-reveal-id="socialModal" data-reveal-ajax="true"><span class="icon-facebook"></span></a></li>                                  
    <li><a href="http://www.linkedin.com/shareArticle?mini=true&url=<?php the_permalink();?>&summary=<?php echo get_the_excerpt();?>&title=<?php echo get_the_title();?>" data-reveal-id="socialModal" data-reveal-ajax="true"><span class="icon-linkedin"></span></a></li>                                 
    <li><a href="https://plus.google.com/share?url=<?php the_permalink();?>"><span class="icon-googleplus" data-reveal-id="socialModal" data-reveal-ajax="true"></span></a></li>
 </ul>

 <div id="socialModal" class="reveal-modal" data-reveal> 
    <a class="close-reveal-modal">&#215;</a>
    <!-- Ajax Content -->
 </div>

 <script>
    $(document).foundation({});
 </script>