0

Here is what I want my fetch api to do:

Make a get request to get json data

Have a foreach loop to turn that json data into items that get put in a grid

Here is my html code:

{{> navbar }}
<link rel="stylesheet" href="./public/css/earn.css">
<link rel="stylesheet" href="./public/css/testing.css">
<div class="content-box">
  <div class="content_wrapper">
    <div style="text-align: center;" class="content" data-simplebar>
      <div class="itemcontainer" style="background-color: #1c1c1c; width:50%; border-radius: 10px;">

      </div>
    </div>
  </div>
</div>
{{> modal }}
{{> footer }}
{{> socketio }}

Here is my js code:

<script>
  fetch('/api/PublicInventory').then(data=>{
    return data.json();
  }).then(response=>{
    console.log(response)
    response.forEach(element => {
      var list = document.getElementsByClassName("itemcontainer");
      var item = document.createElement("item");
      var fullname = element.market_hash_name.split('|');
      var firstpart = fullname[0];
      var secondpart = fullname[1];
      var imagesrc = element.icon_url;
      var itemprice = element.price/100;
      item.innerHTML = `     
      <div class="item">
      <div class="item-title">${firstpart}<br>${secondpart}</div>
      <img src="${imagesrc}" alt="">
      <div class="cost">$${itemprice}</div>
      </div>`
      list.appendChild(item);
    })
  })
</script>

The error I am getting is: TypeError: list.appendChild is

Community
  • 1
  • 1
Bob Boby
  • 183
  • 8

0 Answers0