I followed a tutorial on YouTube that tells how to play a video on hover and pause it when the mouse is out. The code works like charm but I want to modify it. Currently, the video starts from the same place where we left but I want it to start from 0 every time the user hovers.

<script>
const clip = document.querySelectorAll('.clip');
for (let i = 0; i < clip.length; i++) {
    clip[i].addEventListener('mouseenter',
        function(e){
            clip[i].play()
        })
    clip[i].addEventListener('mouseout',
        function(e){
            clip[i].pause()
        })
}
</script>