Javascript 可以在附加到DOM时添加循环吗？

我将一些信息附加到DOM中，但意识到我需要的一些信息嵌套在一个对象中。当我执行下面的代码时，循环中的部分返回为未定义。是否有一种方法可以迭代并提取这些信息，以便我可以将其附加到我的页面：

function placeOnPage(allStopsWithRoutes){
  allStopsWithRoutes.forEach(function(stop){

    $('#stops').append("Stop: " + stop.crossStreets + "<br>" +

        // LOOP HERE
        stop.routes.forEach(function(route){
        "Bus Name: " + busName + "<br>" + 
        "Stops Away: " + stopsAway + "<br>" +
        "Destination: " + destination + "<p>"
        });
        // END LOOP

      );
  });
}

功能位置第页（所有停止开关）{
所有StopSwithRoutes.forEach（函数（停止）{
$（'#stops'）。追加（“Stop:+Stop.crossStreets+”
“+
//在这里循环
stop.routes.forEach（功能（路由）{
总线名称：“+busName+”
“+
停止：“+stopsAway+”
”+
“目的地：“+目的地+””
});
//端环
);
});
}

我认为字符串不能以这种方式连接。将方法更改为先串联，然后将其存储在变量中。然后附加变量

function placeOnPage(allStopsWithRoutes) {
    allStopsWithRoutes.forEach(function(stop) {
        var concatenatedStr = '';
        stop.routes.forEach(function(route) {
            concatenatedStr += ("Bus Name: " + busName + "<br>" +
                "Stops Away: " + stopsAway + "<br>" +
                "Destination: " + destination + "<p>");
        });
        $('#stops').append("Stop: " + stop.crossStreets + "<br>" + concatenatedStr);
    });
}

功能位置第页（所有停止开关）{
所有StopSwithRoutes.forEach（函数（停止）{
var concatenatedStr=''；
stop.routes.forEach（功能（路由）{
ConcatatedStr+=（“总线名称：+busName+”
）+
停止：“+stopsAway+”
”+
“目的地：“+Destination+””；
});
$（'#stops'）。追加（“Stop:+Stop.crossStreets+”
“+concatenatedStr）；
});
}

谢谢，这很有帮助。我试着在添加之前运行循环，并在变量中存储您的想法。谢谢你。@hidace，很高兴这有帮助：）