I'm running into an issue when I try to add a classname to the parent div when the child has of the parent has a class name of 'full-width'

The following code and markup is used

JS

const child = document.getElementsByClassName('full-width');
child.parentElement.classList.add('full-width-container');

HTML

<div class="wp-container-10 wp-block-columns">
    <div class="wp-container-9 wp-block-column full-width has-green-background-color has-background">
         <!-- content -->
    </div>
</div>

However I do get an error in my console saying

Uncaught TypeError: Cannot read properties of undefined (reading 'classList')

When searching for this error it mostly occurs when trying to access the classList property on a null value. However this isn't true when I log child.

console.log(child) returns

HTMLCollection []
0: div.wp-container-9.wp-block-column.full-width.has-green-background-color.has-background
length: 1
[[Prototype]]: HTMLCollection

Also the JavaScript is loaded at the end of the page after the HTML which has the class name.

I really don't get it why I'm still getting this error and why this code doesn't work. Any help is much appreciated.