$(document).ready(function(){

    /* Read JSON from a file */
    fetch("products.json")
    .then(function(resp)
        {
        return resp.json();
    }
    )
    .then(function(jsonData) {

    console.log(jsonData);

    let result = jsonData.products;

    $.each(result, function(index, obj) {
            $('.result').append(
                `<div class="col-sm-6 col-md-4 col-lg-3">                                  
                    <h2>${obj.item_name}</h2>
                    <img src="${obj.item_image}"
                        class="img-fluid img-thumbnail border rounded"
                        style="max-width:100%; height:auto"
                        alt="${obj.item_title}"
                        width="150" />                        
                    <p class="cost">${obj.currency}${obj.mc_gross}</p>                   
                    <p>${obj.item_description}</p>                                  
                </div>`
            );
        });

    });

  });