why getlementsbyclass not working for innerHtml in js

Question

    <p class="hello">

    </p>
    <script>
        //function 1 
        // let x = myFunction(20,30)
        function myFunction(a,b){
            return a*b ;
        }
        document.getElementsByClassName("hello").innerHTML = myFunction(2,3);
    </script>

i tried to change text using function, by getelementbyid it's working properly but why it is not working with getelementsbyclass, is there any rule for this ?

try `document.getElementsByClassName("hello")[0].innerHTML = myFunction(2,3);` — Damzaky, Feb 25 '23 at 05:32

score -1 · Answer 1 · answered Feb 25 '23 at 05:33

document.getElementsByClassName returns a HTMLCollection of all elements with the class. You would need to loop over it or access the elements by index.

Use document.querySelector to get the first element matching a selector.

function myFunction(a, b) {
  return a * b;
}
document.querySelector('.hello').textContent = myFunction(2, 3);

<p class="hello"></p>

why getlementsbyclass not working for innerHtml in js

1 Answers1