How To Display YouTube Video with jQuery Plugin

1 ) Index.html

 <div id="box"></div>

<script src="jquery-3.6.0.min.js"></script>

<script src="jquery.youtube.js"></script>

<script>

jQuery('#box').youtube({

id:'co40NMCleuE'

});

</script>

 

2 ).  jquery.youtube.js

 

(function($){

$.fn.youtube=function(options){

var setting=$.extend({

id:'co40NMCleuE',

height:'315',

width:'560',

title:'YouTube video player'

},options);

return this.append('<iframe width="'+setting.width+'" height="'+setting.height+'" src="https://www.youtube.com/embed/'+setting.id+'" title="'+setting.title+'" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>');

};

}(jQuery));

3 ) . /*!Plugin  jQuery v3.6.0 | (c) OpenJS Foundation and other contributors | jquery.org/license */