1. Оформите функцию инициализации события click для deleteButtons.
2. В функции addComment после определения deleteButtons вызовите функцию инициализации передав в нее уже определенные элементы.
let html = document.createElement( 'html' );
html.innerHTML = CommentsSite;
Теперь вы можете манипулировать элементами DOM. Например html.getElementsByTagName('div')
Элемент видео поместить в обертку (например div) с css position : relative
Внутри обертки после видео разместить элемент с вашей сеткой с css position : absolute; top:0; left:0; width:100%; height:100% и задать z-index, обеспечивающий положение над видео.
Массиву значений для автозаполнения сопоставляете массив url для переходов.
На элемент input "вешаете" событие change - api.jquery.com/change
При изменении значения реализуете переход посредством window.location.href
В Вашем примере: $(document).on('change', "#tags", function() {
window.location.href=url_из_массива_соответствующий_текущему_значению;
});
Во-первых title_img в Вашей функции не задано. Я подозреваю, что это переменная title. Если это так, то просто используйте ее определение вне функции:
var title_img = document.getElementById("Title");
В шаблоне присвойте элементу body главной страницы id. Например: ...
В скрипте поставьте условие
if($('body').is('#main')) { var changeHeaderOn = нужное_вам_число; });
Попробуйте четко сформулировать свою задачу. На то, что Вы написали нужно сделать следующие шаги.
Подключите jquery (jquery.com).
Сделайте шаблон для вывода меню.
После загрузки страницы добавьте элемент меню в header $(document).ready(function(){
$('header').append(ваш_элемент_с_меню);
...
});
Смотрите api.jquery.com/append
Выбор движка (CMS) должен исходить из функциональности сайта, а не из дизайна. То, что Вы хотите реализуется посредством шаблона. Если дизайн уже есть, шаблон сделать недолго. Если опишете функционал и структуру сайта помогу определиться с CMS и шаблоном.