How to create a new table inserting a variable into .doc()

I’ve created a SignIn page that allocates its data on variables using document.getElementByClassName.
So, I’m trying to create a new document on Firebase using the person’s name, stored on a variable (which could bring some problems) using — .doc(variableHere) — but I didn’t manage to find a way.

let newUserPrimeiroNome = document.getElementsByClassName("primeiroNome");
let newUserSobrenome = document.getElementsByClassName("ultimoNome");
let newUserEmail = document.getElementsByClassName("email");
let newUserPassword = document.getElementsByClassName("senha");

let btn = document.getElementById("btn");
btn.addEventListener("click", criaNovoUsuario);

function criaNovoUsuario() {
    db.collection("loginsSecretaria").doc(newUserPrimeiroNome) // <- error here
    .add({
        primeiroNome: newUserPrimeiroNome[0].value,
        ultimoNome: newUserSobrenome[0].value,
        email: newUserEmail[0].value,
        senha: newUserPassword[0].value
    }).then(() => {
        console.log("Documento inserido com sucesso");
    }).catch((error) => {
        console.log("Erro ao inserir documento: ", error);
    });

ps.: I’m sorry if I didn’t express myself in very clear way