getElementsByClassName() Method

Rumman Ansari   Software Engineer   2023-03-26   181 Share
☰ Table of Contents

Table of Content:


The getElementsByClassName() method is used for selecting or getting the elements through their class name value. This DOM method returns an array-like object that consists of all the elements having the specified classname . On calling the getElementsByClassName() method on any particular element, it will search the whole document and will return only those elements which match the specified or given class name.

HTML Code:



<h2> You can change the below paragraph details. Click below Button</h2>
<p class="paragraphName"> This is paragraph Before click.</p>  
<input type="button" value="Chnage Text" onclick="ChangeDetails()"/>   

JavaScript Code:


<script type="text/javascript">

function ChangeDetails(){  
    const paragraph = document.getElementsByClassName("paragraphName");  
    paragraph[0].innerHTML = "This is paragraph After click.";
}  

</script> 

Live Preview