打印阵列的元素

Question

我试图打印数组的元素。当我尝试一个非常基本的W3学校示例时，它工作得很好，但是当我接受循环和变量并将其修改为我的应用程序时，它的行为很奇怪。

基本上，我有一个用户输入。该输入被推入空数组。我使用循环遍历该数组并将每个元素打印到屏幕上。如果您看到图片，则说明打印不正确。我尝试了三种不同版本的循环，并且都没有以我期望的方式打印。

我从函数中实例化charNotInWordArr。

var charNotInWordArr = [];

相关JS：

charNotInWordArr.push(userInput);
console.log("the char is not in the word");
console.log("the char is " + userInput)

for (var i = 0; i < charNotInWordArr.length; i++) {
   $('#wrongGuessList').append("<li class='list-group-item'>" + userInput[i] + "</li>");
}

其他循环出错：

$.each(charNotInWordArr, function(userInput) {
     $('#wrongGuessList').append("<li class='list-group-item'>" + userInput[i] + "</li>");
});


$.each(charNotInWordArr, function(index, value) {
    $('#wrongGuessList').append("<li class='list-group-item'>" + value[i] + "</li>");
});

它的打印方式如下：