Как удалить текущий элемент и вывести следующий?

Question

[Артём Чапурин]

Всем привет! Есть такой код. Таб навигация которая выводит соответствующие пункту содержимое (видео). Возникла такая проблема, что после начала воспроизведения видео и щелчку по новому пункту старое видео продолжает работать. Как возможно предотвратить это с минимальными изменениями в текущем коде? Приходит на ум удаление текущего содержимого и добавление следующего, но как это реализовать?

<section class="for-her__video">
			  <div class="tab-content">
			    <div><iframe width="680" height="427" src="https://www.youtube.com/embed/krHosWqoj0E?controls=0&showinfo=0&modestbranding=1" frameborder="0" class="her-video3"></iframe></div>
			    <div><iframe width="680" height="427" src="https://www.youtube.com/embed/apaclmxcUMg?controls=0&showinfo=0&modestbranding=1" frameborder="0" class="her-video1"></iframe>
			    </div>
			    <div><iframe width="680" height="427" src="https://www.youtube.com/embed/eUrTMeXd2bk?controls=0&showinfo=0&modestbranding=1" frameborder="0" class="her-video2"></iframe></div>
			  </div><!-- //tab-content -->


			  <ul class="tab-menu">
			    <li class="active">
			    <img src="/src/image1">
			    <div class="video-right-block__text">
			       block1
			        </div>
			    </li>
			    <li>
			    <img src="/src/image2">
			        <div class="video-right-block__text">
                                block2
			        </div>
			    </li>
			    <li>
			    
			    <img src="/src/image3">
			    <div class="video-right-block__text">
                                block3
			    </li>
			  </ul>

$(document).ready(function() {
  
  $('.tab-content>div:not(":first-child")').hide();
  $('.tab-menu li:first-child').find(':first');
  
  $('.tab-menu li').each(function(i) {
    $(this).attr('data-tab', 'tab'+i);
  });
  
  $('.tab-content>div').each(function(i) {
    $(this).attr('data-tab', 'tab'+i);
  });
  
  $('.tab-menu li').on('click', function() {
    
    var dataTab = $(this).data('tab');
    var getWrapper = $(this).closest('section');
    
    getWrapper.find('.tab-menu li').removeClass('active');
    $(this).addClass('active');
    
    getWrapper.find('.video-right-block__text');
    getWrapper.find('.tab-content>div(this)').remove();
    getWrapper.find('.tab-content>div[data-tab='+dataTab+']').show();
  });

Answer 1

[Stalker_RED]

Зачем удалять?
$('#playerID').get(0).stopVideo();