如何为使用javascript生成的列表创建搜索功能

Question

基本上，我正在将json url中的数据显示到列表中。 这是我的剧本：

$(window).load(function(){
 $.ajax({
    "url":"http://something.com/myfile.json",
    "crossDomain":true,
    "dataType":"jsonp",      
    'success': function(response){ 

    var collection = response.results;
    for (var i = 0; i < collection.length; i++){   

        $(".list-item").append( '<li><a href="' + results.url +'" class="invites"><span>' + results.title + '</span></a></li>');

  }},
      error: function(err){
          alert('error!' + err);
      } 
});
});

然后我将其显示在列表中。这是html

<div class="box_list">
    <ul class="list-group">
            <li class="list-item" ></li>
    </ul>   
</div>

一切正常，但我想在顶部添加一个搜索框，这样任何人都可以使用关键字搜索列表，但我找不到如何操作。例如，我尝试使用dynatable，但我无法使其工作。帮助

（如果你能告诉我如何在我的清单上实现分页，这将是蛋糕上的樱桃） 提前谢谢！

更新！ 我终于成功了！猜猜我只需要睡觉......我使用this tutorial，希望它可以帮助像我这样的其他新手。再次感谢大家。