Youtube video slideshow stop video on click

Youtube video slideshow stop video on click

I have a youtube video slideshow which gets populated with the use of a
template:
<script id="tFlowplayer" type="text/html">
<div class="rv" id="{{name}}">
<iframe class="{{id_v}}" width="575" height="323"
src="{{id_v}}" frameborder="0" allowfullscreen></iframe>
</div>
</script>
when I click on next or prev I need to stop the current youtube embedded
video playing:
<nav class="arrows">
<button data-goto="prev" class="arrow arrow-left"
rel="prev">Prev</button>
<button data-goto="next" class="arrow arrow-right"
rel="next">Next</button>
</nav>
The following is the click event for the navigation, I guess this where
the action will be happening:
$('[data-goto]').on('click', function (evt) {
var $this = $(this),
where = $this.attr('data-goto'),
video_id = $('[data-play]').attr('data-id');
if (where === 'prev') {
swiper.prev();
} else {
swiper.next();
}
});