How to get the attribute of an innerHTML?

I’m trying to get the value of a span attribute (data-red) inside a table cell.

<td class=" u-tL" headers="due-date" aria-labelledby="due-date"><span data-red="255" style="display: block; width: 75px;">19-JAN-2024</span></td> 

I’ve tried the code below but it’s giving me the error “Uncaught TypeError: spn.getAttribute is not a function”

spn = obj.innerHTML;
console.log(spn.getAttribute('data-red'));

Appreciate any help.