Can I use a jQuery Plugin with GeneratePress

Hello GP Friends,

I'm using the GP child theme. I'd like to include a jQuery plugin that allows for lazy load of Youtube iframe videos: https://github.com/tylerpearson/lazyYT

Is this possible to do with GP? I tried uploading the .js and .css files from the plugin, and then enqueuing them, but couldn't get it to work. I'm wondering if perhaps the way the code is written is not compatible. Or perhaps this should be handled with hooks?

My goal is to get the video category archive page to look like this: http://works.daugilas.com/lazyYT/demo/grid.html
The thumbnail images are loaded from YouTube without the player. An arrow click button overlay is added to the image. And the on_click event cause the actual YouTube player to load. If there's a better way to get this same functionality, without using a wordpress plugin, I'd love to hear it.

Thanks,
Denise

---------------------
The lazyYT.js code
---------------------
/*!
* lazyYT (lazy load YouTube videos)
* v1.0.1 - 2014-12-30
* (CC) This work is licensed under a Creative Commons Attribution-ShareAlike 4.0 International License.
* http://creativecommons.org/licenses/by-sa/4.0/
* Contributors: https://github.com/tylerpearson/lazyYT/graphs/contributors || https://github.com/daugilas/lazyYT/graphs/contributors
*
* Usage:

*/

;(function ($) {
'use strict';

function setUp($el, settings) {
var width = $el.data('width'),
height = $el.data('height'),
ratio = ($el.data('ratio')) ? $el.data('ratio') : settings.default_ratio,
id = $el.data('youtube-id'),
padding_bottom,
innerHtml = [],
$thumb,
thumb_img,
loading_text = $el.text() ? $el.text() : settings.loading_text,
youtube_parameters = $el.data('parameters') || '';

ratio = ratio.split(":");

// width and height might override default_ratio value
if (typeof width === 'number' && typeof height === 'number') {
$el.width(width);
padding_bottom = height + 'px';
} else if (typeof width === 'number') {
$el.width(width);
padding_bottom = (width * ratio[1] / ratio[0]) + 'px';
} else {
width = $el.width();

// no width means that container is fluid and will be the size of its parent
if (width == 0) {
width = $el.parent().width();
}

padding_bottom = (ratio[1] / ratio[0] * 100) + '%';
}

//
// This HTML will be placed inside 'lazyYT' container

innerHtml.push('

'); // end of .ytp-large-play-button

innerHtml.push('