Javascript-форум - Копирование контейнера

Javascript-форум (https://javascript.ru/forum/)

- Общие вопросы Javascript (https://javascript.ru/forum/misc/)

- - Копирование контейнера (https://javascript.ru/forum/misc/72210-kopirovanie-kontejjnera.html)

Копирование контейнера

https://jsfiddle.net/3vqfatoj/ есть код,
есть входящие параметры:

let text = {name: "testserver", map: "de_dust2", password: false,  maxplayers: 10}; 
let text = {name: "testserver1", map: "de_inferno", password: false,  maxplayers: 10}; 
let text = {name: "testserver2", map: "de_cs15", password: true,  maxplayers: 10};

На данный момент, все копируется в один контейнер div.
Необходимо, на каждый параметр text их допустим 3, создавать контейнер , то есть их должно быть 3 штуки, как это организовать в коде?

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Document</title>
</head>
<body>
<script>
let arr =[{name: "testserver", map: "de_dust2", password: false,  maxplayers: 10},
	{name: "testserver1", map: "de_dust2", password: false,  maxplayers: 10}, 
	{name: "testserver2", map: "de_dust2", password: false,  maxplayers: 10}];

for(var i = 0; i<arr.length; i++) document.body.insertAdjacentHTML('beforeend', '<div>'+arr[i].name+' '+arr[i].map+' '+arr[i].password+' '+arr[i].maxplayers+'</div>');
</script>
</body>
</html>

Цитата:

Сообщение от j0hnik (Сообщение 475281)

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Document</title>
</head>
<body>
<script>
let arr =[{name: "testserver", map: "de_dust2", password: false,  maxplayers: 10},
	{name: "testserver1", map: "de_dust2", password: false,  maxplayers: 10}, 
	{name: "testserver2", map: "de_dust2", password: false,  maxplayers: 10}];

for(var i = 0; i<arr.length; i++) document.body.insertAdjacentHTML('beforeend', '<div>'+arr[i].name+' '+arr[i].map+' '+arr[i].password+' '+arr[i].maxplayers+'</div>');
</script>
</body>
</html>

Мне не просто вывод нужен строк, с создание контейнера, и заполнение его, я же дал пример контейнера

SpaceAlarm,

Цитата:

Сообщение от SpaceAlarm

создание контейнера, и заполнение его, я же дал пример контейнера

А j0hnik дал вам пример создания контейнера.
Ну, если вы не можете воспользоваться этим примером самостоятельно...

<!DOCTYPE html>
<head>
</head>
<body>
<script>
let arr =[{name: "testserver", map: "de_dust2", password: false,  maxplayers: 10},
	{name: "testserver1", map: "de_dust2", password: false,  maxplayers: 10}, 
	{name: "testserver2", map: "de_dust2", password: false,  maxplayers: 10}];

for(var i = 0; i<arr.length; i++) { 
   document.body.insertAdjacentHTML('beforeend','<table class="table" style="table-layout:fixed"><tbody></tbody></table>');
   var j = 0;
   for (var key in arr[i]) {
     document.querySelectorAll("table tbody")[i].insertAdjacentHTML('beforeend','<tr><td>'+key+'</td><td><div id="test'+i+j+'">' + arr[i][key] + '</div></td></tr>');
     j++; 
  }
}
</script>
</body>
</html>

Цитата:

Сообщение от Dilettante_Pro (Сообщение 475302)

SpaceAlarm,

А j0hnik дал вам пример создания контейнера.
Ну, если вы не можете воспользоваться этим примером самостоятельно...

<!DOCTYPE html>
<head>
</head>
<body>
<script>
let arr =[{name: "testserver", map: "de_dust2", password: false,  maxplayers: 10},
	{name: "testserver1", map: "de_dust2", password: false,  maxplayers: 10}, 
	{name: "testserver2", map: "de_dust2", password: false,  maxplayers: 10}];

for(var i = 0; i<arr.length; i++) { 
   document.body.insertAdjacentHTML('beforeend','<table class="table" style="table-layout:fixed"><tbody></tbody></table>');
   var j = 0;
   for (var key in arr[i]) {
     document.querySelectorAll("table tbody")[i].insertAdjacentHTML('beforeend','<tr><td>'+key+'</td><td><div id="test'+i+j+'">' + arr[i][key] + '</div></td></tr>');
     j++; 
  }
}
</script>
</body>
</html>

а как сделать, что бы не копировало? http://prntscr.com/i16t8a данные arr приходят каждую секунду с сокета