jQuery JSON Retrieve and Print GIveaway and Promo History

I stored my referral information in a remote JSON file and here I made a code in jQuery to get the JSON and print them to the page.

by Fajar Purnama

HTML

<div id="promo"></div>

<!-- The code below is for bittube airtime monetization, you may ignore, or are you interested? you can make yours here https://bittube.app/?ref?2JY4FE0CP -->
<meta name="airtime-platform-display" content="jsfiddle.net.0fajarpurnama0">
<meta name="airtime-platform-id" content="70437240-ae18-efdd-ab00-0c83e35039af">
<script src="https://bittubeapp.com/tubepay/airtime.loader.js" data-verify="meta" data-autostart="true"></script>
<!-- bittube airtime code ends -->

CSS

.amount{
  color: #FFFFFF;
  background: #912C22;
  text-shadow: 0 0 10px #FFFFFF;
}

JavaScript

$(document).ready(function(){
  promo();
})

function promo(){
  $.getJSON('https://0fajarpurnama0.github.io/assets/json/promo.json', function(data) {
   var promo_length = data.promo.length;
    
    for(i = 0; i < promo_length; i++){
      print("promo", data.promo[i].image, data.promo[i].name, data.promo[i].amount, data.promo[i].date, data.promo[i].description)
    }
  });
}

function print(id, image, name, amount, date, description){
  $('#'+id).append(`
  	<figure>
    	<img src="`+image+`" alt="`+image+`" />
      <figcation><h2>`+name+`</h2></figcaption>
    </figure>
    <ul>
    	<li class="amount">Amount: `+amount+`</li>
      <li>Date: `+date+`</li>
      <li>Description: `+description+`</li>
    </ul>
  `);
}