Hilfe mit einem Script

Hallo, Ich habe folgendes Problem, dass auf dem Bild zusehen ist https://prnt.sc/plm4g1 . Ich möchte, dass Heavy neben Calais - Duisburg (Road) steht.

Der hier verwendete Code

<style> .card-header,h2{ text-align:center; font-weight:700; font-size:20px; } table{ width:80vw; margin:0 auto; border:1px solid black; border-collapse:collapse; } th{ background:lightgrey; } td,th{ padding:2px 10px; border:1px solid black; } textarea{ width:80vw; height:50vh; margin:5vw; border:2px solid red; padding:10px; word-break:break-all; } </style> <body> <main> <div class="card-header"> TruckersMP Stats </div> <table> <tr> <th colspan="4">Server: Simulation 1</th> </tr> <tbody> </tbody> </table> </main> <h2>Erzeugter Quelltext</h2> <textarea></textarea> <script> function getThem(id, url) { var request = new XMLHttpRequest(); request.open('GET', url); request.responseType = 'json'; request.send(); request.onload = function () { var jsonObj = request.response; console.log(jsonObj); var tbody = document.querySelector(id); for(a=0;a<=10;a++){ var tr = document.createElement('tr'); arra=[jsonObj.response[a].name,jsonObj.response[a].url,jsonObj.response[a].short,jsonObj.response[a].game]; for(p=0;p<4;p++){ var td = document.createElement('td'); td.textContent =arra[p]; tr.appendChild(td); } tbody.appendChild(tr); } } } getThem('tbody', '/daten_webseite/tracker_api_selbshosting.json'); //https://api.truckyapp.com/v2/traffic/servers',a); //https://api.truckyapp.com/v2/traffic/top?server=sim1&game=ets2',a) setTimeout(function(){ bo=document.getElementsByTagName('main')[0].outerHTML; document.getElementsByTagName('textarea')[0].value=bo; },2000); </script> </body>