JSFiddle - React, Tailwind, and code Playground

by lasha

HTML

<div id="latest-video"></div>

JavaScript

$(function() {
    // youtube jsonp api endpoint
    var url = "http://gdata.youtube.com/feeds/api/users/rocketboom/uploads?alt=jsonc&max-results=1&v=2";

    // ping youtube to get latest rocketboom video
    (function fetchLatestVideo() {
        $('.yt-loader').show();
        $.getJSON(url, function(response) {
            var uid = response['data']['items'][0]['id'] || false;
            if (uid) { appendVideo(uid) }
            $('.yt-loader').hide();
        })
    })();
    
    // generate youtube iframe embed and insert into page
    function appendVideo(uid) {
        $('<iframe width="217" height="122" src="http://www.youtube.com/embed/'+ uid +'?controls=0" frameborder="0" rel="0"></iframe>').appendTo($('#latest-video'));
    }
})