JSFiddle - React, Tailwind, and code Playground
HTML
<div class="masonry-container largeRec">
<div>
<div class="itemMasVideo"></div>
</div>
</div>
CSS
.masonry-container {
width: 50px;
height: 50px;
background-color: black;
z-index: 1;
}
.item_largeRec_video_height {
width: 80%;
height: 80%;
background-color: blue;
z-index: 2;
}
JavaScript
(function( $ ) {
$.fn.masonrySupport = function( option ) {
if ( option === "large") {
this.find('div.itemMasVideo').parent().addClass('item_largeRec_video_height');
}
if ( option === "small" ) {
this.find('div.itemMasVideo').parent().addClass('item_smallRec_video_height');
}
return this;
};
}( jQuery ));
$( 'div.masonry-container.largeRec' ).masonrySupport( "large" );