Alphavantage API - Symbol undefined

I'm relatively new with the API services and trying to build a dashboard where I'm getting data from Alphavantage API. I'm trying to get 3 symbols simultaneously by creating a list and passing the index to my API call. I'm showing 1 row for each symbol. It's all working fine but when I try to get the Symbol like MSFT/IBM it gives me undefined. I want to append the symbol on the front of each row so the user can get an idea of what symbol rates are in the rows. Not sure what I'm doing wrong here or if there's any workaround that would be appreciated, but any help would be great!

Complete working example is in the code pen: https://codepen.io/kenny-kk/pen/JjWyrwK

HTML

<button id="get_data" onclick="getData()" class="btn btn-primary" style="margin-left: 5%;">Get Data</button>

Javascript

symbol = ["IBM", "MSFT", "AAPL"];
function getting_data(){
  // if(company !== null){
    
    for (i = 0; i < symbol.length; i++) {
    $.getJSON("https://www.alphavantage.co/query?function=TIME_SERIES_INTRADAY&symbol="+symbol[i]+"&outputsize=compact&interval=60min&apikey="+api)
    .done(async function(data){
      console.log(data)
      if (data.Note) {
        alert(data.Note);
        return
      }
      const responceData = [];
      var date = data["Time Series (60min)"]
      console.log(date)
      let a = 1;
      // let b = 7;
      for(var d in date){
        // var r = d.split("-");
        if(a-- > 0){
          var value = date[d];
          // dps.unshift({x: new Date(parseInt(r[0]), parseInt(r[1])-1, parseInt(r[2])), y: parseFloat(value["1. open"])});
          // if(b-- > 0){
            let c = [d, value["1. open"], value["2. high"], value["3. low"], value["4. close"], value["5. volume"]];
            responceData.push({
              date: d,
              open: value["1. open"],
              high: value["2. high"],
              low: value["3. low"],
              close: value["4. close"],
              volume: value["5. volume"],
            });
          // }
        }else{
          break;
        }
      }

After going through the documentation, Alpha vantage API allows you to use the Symbol from it's response inside Meta Data. I don't know why you're trying to access it with the array you created. You just have to access it inside for loop like

var symbolZ = data['Meta Data']['2. Symbol']

and push this symbolZ in responceData like,

responceData.push({
              Symbol: symbolZ,
              date: d,
              open: value["1. open"],
              high: value["2. high"],
              low: value["3. low"],
              close: value["4. close"],
              volume: value["5. volume"],
            });

Finally, populate this data in your table inside td,

html += '<td>' + data.Symbol + '</td>'