title: jQuery not working on dynamically generated divs
body: <p>I am creating a portfolio section of a website which utilizes Flickr's REST api. The list of portfolio items, however, is generated dynamically by this code:</p>
  
  <pre><code>$.ajax({
    url: "https://api.flickr.com/services/rest?method=flickr.photoSets.getList&amp;user_id=********@N04&amp;format=json&amp;nojsoncallback=1&amp;api_key=***********",
    context: document.body
  }).done(function(results) {
    results.photosets.photoset.map(function(item) {
      var imgUrl = "https://farm" + item.farm + ".staticflickr.com/" + item.server + "/" + item.primary + "_" + item.secret + "" + ".jpg";
      $(" #portfolio_horizontal_container ").append(
        '&lt;div class="portfolio_item interior design"&gt; \
            &lt;img  src=' + imgUrl + '    alt="" /&gt; \
            &lt;div class="port-desc-holder"&gt; \
                &lt;div class="port-desc"&gt; \
                    &lt;div class="grid-item"&gt; \
                        &lt;h3&gt;&lt;a href="folio-single"&gt;Quisque non augue&lt;/a&gt;&lt;/h3&gt; \
                        &lt;span&gt;Photography /   Web design&lt;/span&gt; \
                    &lt;/div&gt; \
                &lt;/div&gt; \
            &lt;/div&gt; \
        &lt;/div&gt;'
      )
    })
  });
  </code></pre>
  
  <p>I also have another plugin which manages the portfolio interactions and style. However when the DOM elements for the portfolio items get loaded this other plugins just doesn't work, thus the functionality it applies to the portfolio is non existent. I have tried and tried to solve this with no success. Any thoughs?</p>