Select HTML (css like) child elements with Javascript

by Keith Elias

HTML

<div id="mainDiv"> 
        <div>child1</div>
        <div>child2</div> 
        <div>child3</div> 
        <div>child4</div>   
        <div>child5</div>
        <div>&nbsp;</div>   
</div>

<div id="result"></div>

JavaScript

var mainDiv = document.getElementById('mainDiv');
var x = mainDiv.children[1].textContent;
var y = document.getElementById('mainDiv').children[3].textContent;

document.getElementById('mainDiv').children[3].style.color="red";
document.getElementById('mainDiv').children[1].style.cssText="background-color:pink;font-size:55px;border:2px dashed green;color:white;";
document.getElementById( 'result' ).textContent = "result is: " + '1: ' + x + ',  2: ' + y;