Вывод ссылки в зависимости от Select Options

by George Bash

HTML

<script src="http://code.jquery.com/jquery-latest.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>
<select name="a" id="select1">
<option value="">Выберите</option>
<option id="e1" value="Youtube">Youtube</option>
<option id="e2" value="Vk">Vk</option>
</select>
<select id="Youtube" name="select" class='test e1'>
<option value="0" title="">Выберите серии/части</option> 
<option value="https://www.youtube.com/embed/Ta3I7HC6kgE" title="">1 серия</option>
<option value="https://www.youtube.com/embed/OllOn2UUl3g" title="">2 серия</option>
<option value="https://www.youtube.com/embed/zCjElNgzdSs" title="">3 серия</option>
</select>
<select id="Vk" name="select" class='test e2'>
<option value="0" title="">Выберите серии/части</option> 
<option value="https://vk.com/video_ext.php?oid=-202524996&id=456239133&hash=22cff3d476b0d642&hd=2" title="">1 серия</option>
<option value="https://vk.com/video_ext.php?oid=-202524996&id=456239141&hash=f1386a736ea26662&hd=2" title="">2 серия</option>
<option value="https://vk.com/video_ext.php?oid=-202524996&id=456239142&hash=3b0b05a2a9ea5803&hd=2" title="">3 серия</option>
</select>

<div id="proso1"><br><iframe width="420" height="250" src="" allowfullscreen></iframe></div>

CSS

.test {
  display: none;
}

JavaScript

$(function(){
  $('#select1').change(function(){
    $('.test').hide();
    var id=this.options[this.selectedIndex].id;
    $('.'+id).show();
  });
});

document.querySelector('#Youtube').onchange = function() {
  var a = document.querySelector('#proso1 iframe');
  a.src=this.value;
};

document.querySelector('#Vk').onchange = function() {
  var a = document.querySelector('#proso1 iframe');
  a.src=this.value;
};