How to obtain ID based on ClassName and modify its innerHTML?

I am attempting to use ClassName in order to obtain elementID across multiple layouts for a specific button. By having the following code, how can I obtain the element ID?

var fwdButton = document.getElementsByClassName("fwdButton");

I’ve been trying:

var fwdButton = document.getElementsByClassName("fwdButton").id;  //incorrect

or directly attempted to modify its text by using:

var fwdButton = document.getElementsByClassName("fwdButton");
fwdButton.innerHTML='myText';

But none of them worked for me.

So question is: How can I update fwdButton text or any of its property? as well as how can I obtain the ElementID to access to its innerHTML in case of no way with first attempt?

Regards,
Flavio

var fwdButton = document.getElementsByClassName("fwdButton")[0].id

MrAddy,

Your sentence provide the id, which is fine, however by using the following code doesn't change the text (innerHTML):

   var fwdButton = document.getElementsByClassName("fwdButton")[0].id;
   fwdButton.innerHTML='Skip';

Regards,
Flavio

Hi Flavio, try this javascript...

var a = document.getElementsByClassName("fwdButton")[0].id;
var b = hypeDocument.getElementById(a);
b.innerHTML='Skip';

Or if you need to retain the format you are using, you could try…

var fwdButton = document.getElementsByClassName("fwdButton")[0].id;
document.getElementById(fwdButton).innerHTML='Skip';
1 Like

Hi Greg,

This worked fine.

var a = document.getElementsByClassName("fwdButton")[0].id;
var b = hypeDocument.getElementById(a);
b.innerHTML='Skip';

In addition, I guess that by using className and having a couple of objects associated to same class, at the end I should use the following code to update all of them across different layouts, right?

var classElements = document.getElementByClassName("fwdButton");
for (i==0, classElements.lenght; i++) {
    a = document.getElementByClassName("fwdButton")[i].id;
    b = hypeDocument.getElementById(a);
    b.innerHTML='Skip';
}

Regards,
Flavio

1 Like