document.getElementById returns [object HTMLTableCellElement]

Question

Right now, I have this td:

<td id="setCustomer"><?= $customer ?></td>

Later down the page I have:

<script>
document.getElementById('setCustomer').onclick = function(){
var newOne = document.getElementById('setCustomer');
console.log("var newOne is "+newOne); 
}
</script>

When I click the table cell that contains this customer name, the function launches and spits out:

var newOne is [object HTMLTableCellElement]

instead of:

var newOne is ACME CORP.

what am I doing wrong?

Answer 1

You need the content of the element, not the element itself:

var newOne = document.getElementById('setCustomer').innerHTML;