Selecting second children of first div children in javascript

 var mainDiv = document.getElementById('mainDiv');
 var x = mainDiv.children[0].children[1];

or

 var mainDiv = document.getElementById('mainDiv');
 var x = mainDiv.getElementsByTagName('div')[0].getElementsByTagName('div')[1];

I would go simply with just one line of vanilla code.

Works for any elements, is not limited to the tag names you have in the structure. But the number of elements and the hierarchy must be preserved.

var requiredDiv = document.getElementById('mainDiv').firstChild.firstChild.nextSibling;

Assuming that structure is static you can do this:

var mainDiv = document.getElementById('mainDiv'),
    childDiv = mainDiv.getElementsByTagName('div')[0],
    requiredDiv = childDiv.getElementsByTagName('div')[1];

Further reading: .getElementsByTagName() (from MDN).