Клик по div для встраивания iframe
 

Прошу помощи,

<div id="box"></div>
[JS]

var player=document.getElementById('box');

player.onclick = function() {

var img = document.createElement('iframe');

img.id = "ytplayer";
img.type="text/html";
img.width="400";
img.height="300";
img.src="https://www.youtube.com/embed/blablabla?autoplay=1&controls=0&end=18&fs=0&modestbranding=1&rel=0&showinfo=0&start=14&color=white&iv_load_policy=3"
img.frameborder="0";
img.allowfullscreen;

if (!this.childNodes.length) this.appendChild(img);
}

[/JS]

При нажатии на div, загружается iframe (определенный отрезок ролика из youtube) и воспроизводится без клика, по окончании воспроизведения, ролик становится на паузу, И при следующем клике ролик воспроизводится с начала 0:00, а не с начала выбранного мной диапазона. Я хотел бы сделать так, чтобы ролик опять воспроизводился с нужного места.

Моя мысля: умных мыслей нет, т.к. как я начинающий юзер. В api youtube сильно не ковырялся. Хотелось бы, чтобы при клике iframe удалялся и снова встраивался в div.