JSFiddle - React, Tailwind, and code Playground

HTML

<div id="x"></div>

JavaScript

$(document).ready(function(){

      getVideos('cats');

    });


    function getVideos(query){
      var url = 'https://www.googleapis.com/youtube/v3/search?part=snippet&maxResults=2&q='+query+'&regionCode=us&type=video&fields=items(id)&key=AIzaSyCCOnozV0lEfnjfMTjpc4TFExAeIGJ6Fh0';
      $.ajax({
        url: url,
        success: function(data){
          appendVideos(data);
        }
      });
    }

    function appendVideos(data){
      // works here
      console.log(data);
      
      // but not in $.each
      $.each(data.items, function(i, item){
        $('#x').append(item.id.videoId + '<br>');
      });
    }