Javascript firebase使用foreach更改按钮的文本内容

我试图使用foreach循环来访问我的firebase数据库，并在5个按钮中填充答案。正在抛出的错误是

FIREBASE WARNING: Exception was thrown by user callback. file:///Users/michaelheneghan/Desktop/CS353C/JudgingPage.html:229:69
https://cdn.firebase.com/js/client/2.4.1/firebase.js:200:357
ka@https://cdn.firebase.com/js/client/2.4.1/firebase.js:35:276
ka@https://cdn.firebase.com/js/client/2.4.1/firebase.js:35:270
ka@https://cdn.firebase.com/js/client/2.4.1/firebase.js:32:467
R@https://cdn.firebase.com/js/client/2.4.1/firebase.js:83:381
forEach@https://cdn.firebase.com/js/client/2.4.1/firebase.js:200:327
file:///Users/michaelheneghan/Desktop/CS353C/JudgingPage.html:226:33
https://cdn.firebase.com/js/client/2.4.1/firebase.js:202:714
gc@https://cdn.firebase.com/js/client/2.4.1/firebase.js:52:166
cc@https://cdn.firebase.com/js/client/2.4.1/firebase.js:30:218
dc@https://cdn.firebase.com/js/client/2.4.1/firebase.js:29:1261
Kb@https://cdn.firebase.com/js/client/2.4.1/firebase.js:221:289
[native code]
Ld@https://cdn.firebase.com/js/client/2.4.1/firebase.js:189:253
[native code]
Ld@https://cdn.firebase.com/js/client/2.4.1/firebase.js:179:366
https://cdn.firebase.com/js/client/2.4.1/firebase.js:177:282
zh@https://cdn.firebase.com/js/client/2.4.1/firebase.js:171:466
onmessage@https://cdn.firebase.com/js/client/2.4.1/firebase.js:170:247

TypeError: undefined is not an object (evaluating 'document.getElementsByTagName('button')[counter].textContent = data.child("ChosenAnswer").val()')

我尝试了各种方法，当我打印控制台时，正确的信息正在显示，因此我知道我给了它正确的路径

我试着用setInterval函数来降低速度，以防回调方法出现问题，但仍然没有改变。GameRef实际上是一个变量，它存储一个与他们所处的游戏编号相关的数字

var GameRef = localStorage.getItem("GameRef"); //get the game reference from previous page to pull data down from database
var counter = 0; 
var vals = "";
var trsfAns = "";
var check = "";
console.log(GameRef);

var ref = new Firebase("https://cau-maynooth.firebaseio.com/Game/Game " + GameRef); // Store a link to location of current game
console.log("Ref is " + ref);

ref.on("value", function(snapshot) {
        snapshot.forEach(function(data) { // Loop through each submitted answer and display on buttons for user choice
          var name = data.child("ChosenAnswer").val();
          console.log(name);
            document.getElementsByTagName('button')[counter].textContent = data.child("ChosenAnswer").val();
            counter++; // increment counter to display snapshot data on next button

        });
});

计数器最初设置为0，上面的节点正好有5个子节点。我尝试将信息存储为一个变量并输入该变量，但得到了相同的错误

以下是数据的存储方式，我试图访问并显示“ChosenAnswer”的值：

我知道这可能是一些我不知道的关于Firebase的基础知识，但我是新手，希望有人能帮我一把

非常感谢

*************************编辑************************************

最初，我只将选择的答案存储在Firebase上，下面的代码起作用。我将其更改为包含他们的UID，因为我希望能够在用户赢得游戏后将硬币等分配给用户，但现在它不起作用（见上文）

ref.on（“值”，函数（快照）{
snapshot.forEach（函数（数据）{//遍历每个提交的应答器，并显示在按钮上供用户选择
document.getElementsByTagName（'button'）[counter].textContent=data.val（）；
计数器+++；//递增计数器以在“下一步”按钮上显示快照数据
});
});

使用非精简的lib包含整个堆栈跟踪。还要说明如何验证各个部分是否未定义--getElementsByTagName（'button'）和下面的[counter]。（提示：其中之一是）。可能您正试图在dom准备就绪之前访问dom元素。很难说没有一个。嗨，加藤，我已经编辑了我的帖子，包括我认为你想要的一切。让我知道我是否提交了任何东西，感谢您提供的任何帮助，只是为了测试您的DOM理论并没有准备好，我将我的代码放在下面：var docLoaded=setInterval（function（）{if（document.readyState==“complete”）{clearInterval（docLoaded）；/*我的foreach循环在这里*/}, 100); 但它仍然会产生同样的错误

    {
  "Game" : {
"Game 1" : {
  "-KF8s5IxnxgRabSEyrVk" : "Option number 3",
  "-KF8s7XSeocBwiJQDgY5" : "Option number 1",
  "-KF8sAB-9c74mEaDLlB-" : "Option number 4",
  "-KF8sBLAo8FozBOoiptS" : "Option number 1",
  "-KF8sDBtZ9lvcNXeuxI8" : "Option number 5"
},
"Game 2" : {
  "-KFQnS7qCqFEgRRGZ2NV" : {
    "ChosenAnswer" : "Option number 5",
    "ID" : "5f9ff985-fc3b-48d7-83b4-e28751c1ba66"
  },
  "-KFQo38x_7MlKMHBUB9G" : {
    "ChosenAnswer" : "Option number 5",
    "ID" : "5f9ff985-fc3b-48d7-83b4-e28751c1ba66"
  },
  "-KFQoJ2HT0pioUs8kLgL" : {
    "ChosenAnswer" : "Option number 1",
    "ID" : "5f9ff985-fc3b-48d7-83b4-e28751c1ba66"
  },
  "-KFQocb61r3LVg_cs8HY" : {
    "ChosenAnswer" : "Option number 1",
    "ID" : "5f9ff985-fc3b-48d7-83b4-e28751c1ba66"
  },
  "-KFQooYUTsf_zgKt9xwQ" : {
    "ChosenAnswer" : "Option number 6",
    "ID" : "5f9ff985-fc3b-48d7-83b4-e28751c1ba66"
  }

ref.on("value", function(snapshot) {
        snapshot.forEach(function(data) { // Loop through each submitted answerand display on buttons for user choice
            document.getElementsByTagName('button')[counter].textContent = data.val();
            counter++; // increment counter to display snapshot data on next button

        });
});

<button type="button" class="btn btn-primary btn-lg btn-block"  onclick="selectedAnswer(1)"><label id="s1" for="subOpt1"></label></button>
  <button type="button" class="btn btn-default btn-lg btn-block"  onclick="selectedAnswer(2)"><label id="s2" for="subOpt2"></button>
  <button type="button" class="btn btn-primary btn-lg btn-block"  onclick="selectedAnswer(3)"><label id="s3" for="subOpt3"></button>
  <button type="button" class="btn btn-default btn-lg btn-block"  onclick="selectedAnswer(4)"><label id="s4" for="subOpt4"></button>
  <button type="button" class="btn btn-default btn-lg btn-block"  onclick="selectedAnswer(5)"><label id="s5" for="subOpt5"></button>