JSFiddle - React, Tailwind, and code Playground

HTML

<html>
    
    <head></head>
    
    <body>
        <div id="UCWtQb4oF2kDtub8xfSBkLNQ"></div>
    </body>

</html>

CSS

#player {
    width: 348px;
    height: 240px;
    overflow: hidden;
    background: gray;
    position: absolute;
    border: solid 2px gray;
}
.youtube .carousel {
    width: 20%;
    height: 100%;
    overflow: auto;
    position: absolute;
    right: 0px;
    z-index: 3;
}
.youtube .thumbnail {
    margin: 2px;
    width: 80%;
    border: 1px solid black;
}
.youtube iframe.player {
    width: 80%;
    height: 240px;
    overflow: auto;
    border: 0;
}

JavaScript

/*
Copyright 2011 : Simone Gianni <[email protected]>

Released under The Apache License 2.0 
http://www.apache.org/licenses/LICENSE-2.0

Extended by : Anders Evenrud <[email protected]>

*/

(function () {

    function createPlayer(jqe, video, options) {
        var ifr = $('iframe', jqe);
        if (ifr.length === 0) {
            ifr = $('<iframe scrolling="no">');
            ifr.addClass('player');
        }
        var src = window.location.protocol + '//www.youtube.com/embed/' + video.id;
        if (options.playopts) {
            src += '?';
            for (var k in options.playopts) {
                src += k + '=' + options.playopts[k] + '&';
            }
            src += '_a=b';
        }
        ifr.attr('src', src);
        jqe.append(ifr);
    }

    function createCarousel(jqe, videos, options) {
        var car = $('div.carousel', jqe);
        if (car.length === 0) {
            car = $('<div>');
            car.addClass('carousel');
            jqe.append(car);

        }
        $.each(videos, function (i, video) {
            options.thumbnail(car, video, options);
        });
    }

    function createThumbnail(jqe, video, options) {
        var imgurl = video.thumbnails[0].url;
        var img = $('img[src="' + imgurl + '"]');
        if (img.length !== 0) return;
        img = $('<img>');
        img.addClass('thumbnail');
        jqe.append(img);
        img.attr('src', imgurl);
        img.attr('title', video.title);
        img.click(function () {
            options.player(options.maindiv, video, $.extend(true, {}, options, {
                playopts: {
                    autoplay: 1
                }
            }));
        });
    }

    /**
     * Gets feed from requested user
     */
    function pullFeed(user, cb) {
        var url = window.location.protocol + '//gdata.youtube.com/feeds/users/' + user + '/uploads?alt=json-in-script&format=5&callback=?';
        $.getJSON(url, null, function (data) {
            var...