Uncaught TypeError: document.getElementById(...) is null

Bom dia,

Estou fazendo um select e pegando descrição e preço dos produtos, carrego os dois em "spans" dentro de um "figcaption", dessa forma (exemplo):

Fiz uma função em JS para incrementar ou decrementar os valores e jogar num input:
<script>
valor = 0;
valorItem = 0;
valorItem = document.getElementById('precoProd').textContent;
function incValor(valor_maximo){
valor = valorItem + valor; setValor(valor);
}
function decValor(valor_minimo){
valor = valor - valorItem; setValor(valor);
}
function setValor(valorTotal){
document.getElementById('valorItens').value = valorTotal;
}
</script>

...Porém não está funcionando, e o erro é "Uncaught TypeError: document.getElementById(...) is null" na linha
"valorItem = document.getElementById('precoProd').textContent;"

Se puderem me ajudar, agradeço.

esse elemento com o id='precoProd', existe?

Existe:
<span id="precoProd"><?php echo $precoProduto; ?></span>

Obg