[Bond]

Всем здравствуйте.
Есть жук еще с этой темы Жук который ползает. Возрождение
Решил добавить функционал - добавил кнопку что бы при клике добавлялся еще один жук + чтобы можно было по кликом выбирать жука который становится активным и им можно было управлять.

Посмотреть что получилось можно здесь - http://1.top-start.ru/bug/
Что бы реализовать задуманное создал новый класс который создает жуков
Писал на TypeScript, а вот код который уже сгенерирован в JS

var CreateBug = (function () {
    function CreateBug() {
        this.elemBug = document.getElementById("marg").innerHTML;
        this.create();
        this.eventsBug();
    }
//Метод добавление жука при клике на кнопку
    CreateBug.prototype.create = function () {
        var elementBug = this.elemBug;
//Вешаем клик на кнопку
        document.getElementById("create").addEventListener("click", function () {
//Удаляем класс active так как новый жук уже будет с этим классом
            document.getElementsByClassName("active")[0].classList.remove("active");
//Вставляем нового жука в поле #marg
            document.getElementById("marg").innerHTML += elementBug;
//запускаем метод eventsBug который переназначает клик на всех жуков
            el.eventsBug();
            var bug = new Bug(100, 100, '.active');
        }, false);
    };
//Метод переключения между жуками
    CreateBug.prototype.eventsBug = function () {
        var removeClass = function () { //Функция которая срабатывает при клик
//Удаяем класс active с жука у торого этот класс есть
            document.getElementsByClassName("active")[0].classList.remove("active");
// Добавляем класс active для жука по котором кликнули
            this.classList.add("active");
            var bug = new Bug(this.offsetTop, this.offsetLeft, '.active');
        };
        var elements = document.getElementsByClassName("bug");
//Вешаем событие на всех жуков
        for (var i = elements.length - 1; i >= 0; i--) {
            elements[i].addEventListener('click', removeClass);
        }
    };
    return CreateBug;
}());
var bug = new Bug(100, 100, '.active');

var el = new CreateBug();

Жуки добавляются как было задумано, новый жук становится активным, им можно управлять остальные жуки не двигаются, а вот при переключении между жуками есть проблема - жуки двигаются все на которые кликнул не смотря на то что класс active нормально переключается. А если добавить еще жука то все становится как надо - все жуки стоят на месте - активный двигается.
Все писал в стиле ООП так как цель всего действа именно для изучения ООП + TypeScript а еще чтобы поближе познакомится именно с JS, потому как все время сидел на jQuery
Подскажите в чем проблема, буду признателен за помощь.