document.addEventListener("DOMContentLoaded", function () {
/// Здесь делаем все что надо:
// навешиваем обработчики
// используем загруженные в других скриптах функции
// gen() <-- чтобы это ни было
}, false);
У вас проблемы в понимании того что и когда происходит. Вы просите браузер работать с элементами/функциями, когда их не существует/не загружены.
Во вне DOMContentLoaded вы можете объявлять функции, но если вы пишите
<script>document.addEventListener("DOMContentLoaded", gen);</script>
То функция "gen" должна быть загружена не когда произойдет событие "DOMContentLoaded", а на момент подписки на это событие.