Vanilla js, как проверить, существует ли элемент html перед выполнением скрипта

Вы можете неоднократно проверять заголовок, а затем что-то с ним делать, как только он будет получен таким образом.

var heading;

function getHeading() {
    var interval = setInterval(function() {
        if (heading = document.getElementById('heading')) {
            clearInterval(interval);
            console.info(heading);
            // do some stuff here with your heading
        }
    }, 100);  // 100 represents how often the script checks for existence of heading in ms
}

getHeading();

Сделайте это после загрузки вашего шаблона. Повторная проверка, если что-то произошло (опрос), обычно является плохой идеей. Это должно произойти так как загруженного шаблона. В вашем случае это похоже на goToRoute:

goToRoute: function (htmlName) {
    (function(scope) { 
        var url = 'views/' + htmlName,
            xhttp = new XMLHttpRequest();
        xhttp.onreadystatechange = function () {
            if (this.readyState === 4 && this.status === 200) {
                scope.rootElem.innerHTML = this.responseText;

                // Now it's ready

            }
        };
        xhttp.open('GET', url, true);
        xhttp.send();
    })(this);
}

Возможно, не имеет смысла помещать конкретный код, о котором вы думаете, в goToRoute; чтобы сделать его более универсальным, вы можете подумать о том, чтобы заставить goToRoute принимать параметр обратного вызова или использовать события.