Creating an xml table from javascript with server data

I have this table that shows me the data on the same line:

I'm trying to give it the shape I want but I can't. The idea is to show me the data like this:

The data comes from the mysql server and I create the table like this:

function construirListado(oXML) 
        {

        var oTabla = document.createElement("table");
        oTabla.border = "3";
        var oTHead = oTabla.createTHead();
        var oFila = oTHead.insertRow(-1);
        
        var oTH = document.createElement("TH");
        oTH.textContent = "IDNoticia";
        oFila.appendChild(oTH);
        
        oTH = document.createElement("TH");
        oTH.textContent = "Título";
        oFila.appendChild(oTH);

        oTH = document.createElement("TH");
        oTH.textContent = "Autor";
        oFila.appendChild(oTH);

        oTH = document.createElement("TH");
        oTH.textContent = "Fecha";
        oFila.appendChild(oTH);
                    
        oTH = document.createElement("TH");
        oTH.textContent = "Descripción";
        oFila.appendChild(oTH);
                    
        var oTBody = oTabla.createTBody();      
        var oPersonas = oXML.querySelectorAll("documento");
        for (var i = 0; i < oPersonas.length; i++) {
            oFila = oTBody.insertRow(-1);

            var oCelda = oFila.insertCell(-1);
            oCelda.textContent = oPersonas[i].querySelector("idnotici").textContent;

            oCelda = oFila.insertCell(-1);
            oCelda.textContent = (oPersonas[i].querySelector("titul").textContent);                            
        
            oCelda = oFila.insertCell(-1);
            oCelda.textContent = (oPersonas[i].querySelector("auto").textContent);

            oCelda = oFila.insertCell(-1);
            oCelda.textContent = (oPersonas[i].querySelector("fech").textContent);
            
            oCelda = oFila.insertCell(-1);
            oCelda.textContent = (oPersonas[i].querySelector("descripcio").textContent);
                            
        }
        document.querySelector("#listado").innerHTML = "";
        document.querySelector("#listado").appendChild(oTabla);
    
    }

Data to create the table in the database:

    CREATE DATABASE  IF NOT EXISTS `BdNoticias` /*!40100 DEFAULT CHARACTER SET latin1 */; 
    USE `BdNoticias`;


DROP TABLE IF EXISTS `noticias`;
CREATE TABLE `noticias` (
  `idnoticia` varchar(9) NOT NULL,
  `titulo` varchar(20) NOT NULL,
  `descripcion` longtext NOT NULL,
  `autor` varchar(20) NOT NULL,
  `fecha` date NOT NULL,
  PRIMARY KEY (`idnoticia`)
);

INSERT INTO `noticias` (`idnoticia`, `titulo`, `descripcion`, `autor`, `fecha`) VALUES ('N1234', 'Los Campos', 'En el Bierzo, junto al rio Sil...', 'Victor', '2021-04-06'), ('N4321', 'Selva de Irati', 'En pleno Pirineo Navarro...', 'Eugenio', '2020-08-11');

I know it must be changing them "oTH = document.createElement("TH");" but I can't and it messes up the whole table or it does strange things to me. I am displaying the result in a div with id "list" to show it.

I hope you can help me thanks.

This is the .php getNoticias file where I query the database and create the xml to manage it in the .js:

    <?php

// Configuración BASE DE DATOS MYSQL
$servidor  = "localhost";
$basedatos = "BdNoticias";
$usuario   = "root";
$password  = "";

// Creamos la conexión al servidor.
$conexion = mysqli_connect($servidor, $usuario, $password,$basedatos) or die(mysqli_error($conexion));
mysqli_query($conexion,"utf8");

// Consulta SQL para obtener los datos de los centros.
$sql = "SELECT * FROM noticias";
$resultados = mysqli_query($conexion,$sql);

$XML ='<?xml version="1.0" encoding="UTF-8"?>';
$XML .='<datos>';

while ($fila = mysqli_fetch_array($resultados)) {
    $XML .='<documento>';
        $XML .='<idnotici>'.$fila["idnoticia"].'</idnotici>';
        $XML .='<titul>'.$fila["titulo"].'</titul>';
        $XML .='<descripcio>'.$fila["descripcion"].'</descripcio>';
        $XML .='<auto>'.$fila["autor"].'</auto>';
        $XML .='<fech>'.$fila["fecha"].'</fech>';
    $XML .='</documento>';
}

$XML .='</datos>';

// Cabecera de respuesta indicando que el contenido de la respuesta es XML
header("Content-Type: text/xml");
// Para que el navegador no haga cache de los datos devueltos por la página PHP.
header('Cache-Control: no-cache, must-revalidate');
header('Expires: Mon, 26 Jul 1997 05:00:00 GMT');

echo $XML;

mysqli_close($conexion);
?>