アイソトープが追加されたhtmlで動作しない

Question

ローカルの.xmlファイルから解析されたデータをフィルタリングできないという問題があります。同じコンテナにいくつかのデモイメージがあり、それは作業中で、フィルタリング中です。ですから、isotope.jsは実際に正しく設定されています。何が間違っているのか分かりますか？

これは私の設定です。

のindex.html（HTML +ブートストラップ） '

<a href="#" data-filter="*" class="current">All Categories</a> 
<a href="#" data-filter=".people">People</a> 
<a href="#" data-filter=".places">Places</a> 
<a href="#" data-filter=".food">Food</a> 
<a href="#" data-filter=".objects">Objects</a> 

</div> 

    <div class="col-md-12 skolLista portfolioContainer">` 

javascript.jsを

`

/*jslint browser: true*/ 
/*global $, jQuery, alert, console*/ 
$(window).on('load', function() { 

    var $container = $('.portfolioContainer'); 
    $container.isotope({ 
     filter: '*', 
     animationOptions: { 
      duration: 750, 
      easing: 'linear', 
      queue: false 
     } 
    }); 

    $('.portfolioFilter a').click(function(){ 
     $('.portfolioFilter .current').removeClass('current'); 
     $(this).addClass('current'); 

     var selector = $(this).attr('data-filter'); 
     $container.isotope({ 
      filter: selector, 
      animationOptions: { 
       duration: 750, 
       easing: 'linear', 
       queue: false 
      } 
     }); 
     return false; 
    }); 

}); 



$(document).ready(function(){ 
      $.ajax({ 

      type: "GET", 
      url: "skolor.xml", 
      dataType: "xml", 
      success: xmlParser 

      }); 
     }); 

     function xmlParser(xml){ 

      $(xml).find("Skola").each(function(){ 
      var namn = $(this).find('Namn').text(); 
      var adress = $(this).find('Adress').text(); 
      var arskurser = $(this).find('Arskurser').text(); 
      var huvudman = $(this).find('Regi').text(); 
      var antalElever = $(this).find('Antal_elever').text(); 
      var andelBehorigaLarae = $(this).find('Andel_behoriga_larare').text(); 
      var skolansEpost = $(this).find('').text(); 
       var skolanstelefon = $(this).find('Telefon').text(); 
       /* var skolansEpost = $(this).find('').text();*/ 


      $(".portfolioContainer").append("<div class='element people ' > <h3 class='grid-item people'>" + namn + "</h3>" + 
        "<p class='grid-item arskurser food'>" + arskurser + "</p>" + '<button type="button" class="btn btn-default">Jämför</button> <img src="http://placehold.it/150x150">' + "<p class='grid-item antalElever'> Antal elever:" + antalElever + "</p>" + "<p class='grid-item huvudman'> Regi:" + huvudman + "</p>" + "<p class='grid-item'> Andel Behöriga Lärare:" + andelBehorigaLarae + "</p>" + "</div>"); 



      }); 


     } 

    ` 

Answer 1

解決済み

var $items = $(html); 

    //Add item to isotope 
    $('.grid').isotope('insert', $items);