JQuery динамически загружаемые всплывающие окна

Question

Я пытаюсь загрузить веб-страницу динамически со ссылками и работает нормально, похоже, игнорирует роль всплывающего окна / rel.

мои div-ы как-то связаны с этим?

Может кто-нибудь мне помочь?

$("#button").click(function() {

  var term = $('#term').val();

  var flickerAPI = "http://api.flickr.com/services/feeds/photos_public.gne?jsoncallback=?";
  $.getJSON(flickerAPI, {
      tags: term,
      tagmode: "any",
      format: "json"
    })

    .done(function(data) {
      $.each(data.items, function(i, item) {


        $("#theLinks").append('<a href ="#photo' + item.media.m + '" data-rel="popup" data-position-to="window"> Open pop-up ' + (i + 1) + ' </a> <br> ');

        $("<img>").attr("src", item.media.m).appendTo("#thePopups").wrap('<div data-role="popup" id="photo' + item.media.m + '"></div>');


        if (i === 10) {
          return false;
        }
      });
    });

})();

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="http://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.js"></script>

<div id="theLinks">

</div>


<div id="thePopups">

</div>