Как вывести переменную из js в html class?

Есть вот такой вот html код

<div class="container">
<div>
<span class="open">10</span>
</div>
<div>
<span class="close">20</span>
</div>
<div>
<span class="size">30</span>
</div>
<div>
<span class="result"></span>
</div>

</div>

и js

var o_o = document.getElementsByClassName('open').textcontent;
    
     var c_c = document.getElementsByClassName('close').textcontent;

     var s_s = document.getElementsByClassName('size').textcontent;

    
     var res = ( c_c - o_o ) * s_s ;
     document.getElementsByClassName('result').innerHTML = res

не могу вывести результат, при этом, если заменить в html class на id и в js обращаться через getElementById то все работает, но мне нужно именно через class

ссылка на песочницу на всякий клик