Преобразование из функции JavaScript в jQuery

Question

У меня есть эта функция, и я хотел бы знать, как сделать эту работу с jQuery.

Мой HTML:

<video id="mainVideo" width=320 height=240 autoplay> 
</video> 
<br/> 
<video class="thumbnail" width=100 height=100> 
    <source src="http://html5demos.com/assets/dizzy.mp4" type="video/mp4"> 
</video> 
<video class="thumbnail" width=100 height=100> 
    <source src="http://techslides.com/demos/sample-videos/small.mp4" type="video/mp4"> 
</video> 

Это функция:

var videos = document.querySelectorAll(".videoThumbnail"); 
for(var i = 0; i < videos.length; i++) { 
    videos[i].addEventListener('click', clickHandler, false); 
} 

function clickHandler(e) { 
    var mainVideo = document.getElementById("mainVideo"); 
    mainVideo.src = e.srcElement.currentSrc; 
} 

Answer 1

Это мое решение, в будущем разместить свой HTML код, чтобы помочь нам решить эту проблему:

$(function(){ 
    $('.thumbnail').click(function(){ 
     $('#mainVideo').replaceWith('<video id="mainVideo" width=320 height=240 autoplay></video>'); 
     $('#mainVideo').html($(this).html()); 
    }); 
}); 

fiddle

Answer 2

код уже работает с JQuery, так что нет никакого преобразования необходимо, чтобы сделать его функциональным.

Тем не менее, здесь является более типичным способом сделать это с помощью JQuery:

var mainVideo = $("#mainVideo"); 
$(".videoThumbnail").click(function() { 
    mainVideo.prop("src", this.srcElement.currentSrc); 
});