Henry
Henry

Reputation: 1042

How to set text of div to its Id in javascript

what I am trying to achieve is set the text of a div tag to the name if its ID from javascript. I have tried this;

 mydiv.getElementsByClassName("divDesign").innerHTML = document.getElementsByClassName("divDesign").getElementById; 

However, this returns undefined in the div tag instead of writing its id.

Upvotes: 3

Views: 2621

Answers (2)

Thomas Orlita
Thomas Orlita

Reputation: 1627

Using getAttribute() method:


For the first div with ClassName = 'divDesign':

document.getElementsByClassName('divDesign')[0].innerHTML = document.getElementsByClassName('divDesign')[0].getAttribute('id');

For all divs with ClassName = 'divDesign':

var mydivs = document.getElementsByClassName('divDesign');

for (var index = 0; index < mydivs.length; index++) {
  mydivs[index].innerHTML = mydivs[index].getAttribute('id');
}
<div class="divDesign" id="someId"></div>

Using id() property:


For the first div with ClassName = 'divDesign':

document.getElementsByClassName('divDesign')[0].innerHTML = document.getElementsByClassName('divDesign')[0].id;

For all divs with ClassName = 'divDesign':

var mydivs = document.getElementsByClassName('divDesign');

for (var index = 0; index < mydivs.length; index++) {
  mydivs[index].innerHTML = mydivs[index].id;
}
<div class="divDesign" id="someId"></div>

Documentation: MDN

Upvotes: 1

kanudo
kanudo

Reputation: 2219

Yo need to specify an index of the element as document.getElementsByClassName("divDesign") returns a nodes list.

document.getElementsByClassName("divDesign")[0].innerHTML = 
    document.getElementsByClassName("divDesign")[0].id;
<div class="divDesign" id="iAmAnId"></div>

Upvotes: 0

Related Questions