Access the inner DIV with JavaScript

Question

If I have the following HTML:

<tr class="class">
    <td>
       <div>
       </div>
    </td>
</tr>

How can I access the div with JavaScript knowing that all the styles on the div are applied like this: .class td div { ... } ?

VisioN · Accepted Answer · 2013-05-20 11:28:12Z

7

For modern browsers querySelector() is the way to go:

var html = document.querySelector(".class td div").innerHTML;

For accessing multiple elements you can use querySelectorAll():

var elements = document.querySelectorAll(".class td div");
for (var i = 0, len = elements.length; i < len; i++) {
    // elements[i]. ...
}

answered May 20, 2013 at 11:28

VisioN

146k35 gold badges287 silver badges291 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

This seems to resolve it. Thank you for your help (edit+answer)

@Tbi45 But pay attention that the described approach won't work in IE<8. Then such methods as document.getElementById() or element.getElementsByTagName() must be applied.