JQuery click with data attr

Simple JQuery to handle clicking of items that have data attribute.

by Allen N.

HTML

<div id="video" data-type="video"></div>
<div id="video" data-type="video"></div>
<div id="video" data-type="video"></div>
<div id="video" data-type="video"></div>
<div id="video" data-type="video"></div>
<div id="video" data-type="video"></div>
<div id="video" data-type="video"></div>
<div id="video" data-type="video"></div>
<div id="video" data-type="video"></div>

CSS

body {
	margin: 0;
	padding: 0;
}

div {
	display: inline-block;
	width: 100px;
	height: 100px;
	margin: 10px;
	background-color: #BADA55;
	cursor: pointer;
	transition: all 333ms;
}

JavaScript

$('div[data-type="video"]').each(function () {
		var video = $(this);

		video.on('click', function() {
		
			// Do something...
			video.css('background-color', '#C0FFEE');
			
			setTimeout(function() {
				video.css('background-color', '#BADA55');
			}, 2222);
			
			
		});
});