[Dúvida] Nenhuma alteração na minha Index

Minha função ficou como o código apresentado, com a única diferença sendo na varíavel "valorUnitario" para "valorUnidade".

Ficou assim:

function adicionar() {
    // Recuperar Valores|  nome produto, quantidade e valor
    let produto = document.getElementById('produto').value;
    let nomeProduto = produto.split('-')[0];
    let valorUnidade = produto.split('R$')[1];
    let quantidade = document.getElementById('quantidade').value;
    // Calcular o Preço, o nosso subtotal
    let preco = quantidade * valorUnidade;
    // Adicionar no carrinho
    let carrinho = document.getElementById('lista-produtos');
    carrinho.innerHTML = carrinho.innerHTML + `<section class="carrinho__produtos__produto">
    <span class="texto-azul">${quantidade}x</span> ${nomeProduto} Celular <span class="texto-azul">R${preco}</span>
  </section>`;

    
    // Adicionar no carrinho
    // Atualizar valor total
}

function limpar ()

-

Porém, quando salvo e faço teste na minha index, nada acontece... Poderiam me ajudar a esclarecer essa dúvida?