Как выбрать элемент DOM из querySelectorAll NodeList для применения focus ()?

См. РЕДАКТИРОВАНИЕ ниже для получения наиболее актуальной новой информации.

В директиве angular у меня есть элемент div. Я ищу потомков, которые являются входами, и хватаю первого из них, к которому нужно применить фокус.

var nodes = element[0].querySelectorAll('input, button');

Я могу получить доступ к нужному входу с помощью nodes [0], но я не могу понять, как выполнить для него вызов focus ().

nodes[0].focus() does not work
$(nodes[0]).focus() does not work
angular.element(nodes[0]) does not work

Когда я печатаю список узлов на консоли:

NodeList [ <button.yes.btn.btn-default>, <button.no.btn.btn-default> ]

Когда я выбираю узлы [0] и печатаю на консоли:

<button data-ng-click="showMismatchWarning = false; verifyRentalItemsMatch()" class="yes btn btn-default" type="button" answer="">

Например, это кнопка, к которой я хотел бы применить focus (). Я просто не могу понять, как перейти от результата queryselector к выполнению собственного html focus ()

ИЗМЕНИТЬ (НАИБОЛЕЕ ВАЖНАЯ ИНФОРМАЦИЯ):

Дальнейшая информация. У меня разные вкладки, поэтому они скрыты. Но директива применяется к тому же логическому выражению isPage (x), поэтому элементы DOM должны быть видны к этому моменту времени.

<div ng-show="isPage(1)" myFocus="isPage(1)">
  <input> <--- this very first one focus() seems to work
</div>

<div ng-show=isPage(2)" myFocus="isPage(2)">
  <input> <--- this one the focus() never works
</div>

Если подумать об этом больше, должно быть, что focus () выполняется до того, как элемент DOM станет полностью видимым, поэтому focus () не работает. Но директива $ наблюдает за атрибутами и следит за тем, чтобы это же выражение стало истинным, почему оно должно выполняться до ng-show?

Вот моя директива для справки.

"use strict";
angular.module('something').directive("myfocus", function() {
    return {
        link: function(scope, element, attributes) {
            scope.$watch(attributes.focuson, function(newValue) {
                if(newValue) {
                    highlightAndFocus(element[0]);
                }
            },true);

            function highlightAndFocus(node) {
                var task = $(node);
                task.focus();
                task.addClass('highlight');

                var nextInput = node.querySelector('input, button:not(#cancel)');
                nextInput.focus();
                console.log(nextInput);

            }
        }
    };
});