Image Gallery with JQuery script

I'm trying to build this dynamic gallery image with laravel and this script -> https://github.com/taras-d/images-grid
To display the records on the page I'm using:

<div class="row">
  <div class="imgs">
    @foreach ($portfolio as $port)
      <div class="port-item" data-id=""></div>
    @endforeach
  </div>
</div>

Now, as you can see I'm creating a new div inside the .imgs where I'm passing the id of the portfolio item.
Using jquery I'm looping through each port-item and get the id and then pass it into the url so I can get the data for each database record. Here's what I do:

$(".port-item").each(function(){
  var id = $(this).data("id");
  var url = "/profile/portfolio/data/"+id;

  $.ajax({
    url: url,
    method: "GET",
    }).done(function(response){

      //Save records into variables

      var itemName = response.item;
      var title = response.item_title;

      $('.imgs').imagesGrid({
        images: [
          {
            src: '../uploads/portfolios/'+itemName,      // url
            title: ''+title,        // title
          }
        ]
      });
    });

});

From what I tested, I'm getting the correct data and it's saved in the variables itemName & title. Now the problem.. the .imagesGrid function is from that github plugin I mentioned. As you can see images takes an aray of objects.. What I don't know is how can I loop somehow to display multiple objects based on the itemName and title.. I hope is clear but please let me know if you have any additional questions.. Thanks!



via Ovidiu G