DOM querySelector() usage & focus on Div

Making this to figure out and document how various querySelector queries work

HTML

<section id='s1' class='section1'>
    <div id='d0' class='buttonBar'>
    <button class='focusdv1'>Go to the first Div</button>
    <button id='focusdv2'>Go to the second Div</button>
    <button id='focusdv3'>Go to the inner Div</button>
    </div>
    <div id='d1' class='div1'>
        <br>
        <p>Some text in the div named</p>
        d1 but it's class is div1<br>
        Also
        <br> trying to make this long
            <br>
Failed to make this <br>
Long enough<br>
so<br>
I<br>
will<br>
make this<br>
longer than<br>
it was<br>
...<br>
...<br>
...<br>
...<br>
    </div>
    <div id='d2' class='div2'>
        <p>Some text in the div named</p>
        d2 but it's class is div2<br>
        Also
        <br> trying to make this long
...<br>
...<br>
...<br>
...<br>
            <div id='dind2' class='divInDiv2'>
inner div
...<br>
...<br>
...<br>
...<br>
...<br>
...<br>
...<br>
...<br>                
...<br>
...<br>
...<br>
...<br>
...<br>
...<br>
...<br>
...<br>
...<br>
...<br>
...<br>
...<br>                
                
            </div>
    </div>
</section>

CSS

section
{
    width:100%;
    height:100%;
}
.buttonBar
{
    position: fixed;
    top: 0%;
    right: 0%;
    background-color: #99eeee;
    width: 80%;
}
.div1
{
    background-color: #eefeff;
}
.div2
{
    background-color: #ffe79f;
}
.divInDiv2
{
/*    width: 75%;*/
    left: 50%;
    right: 5%;
    background-color: #f9ff9f;
}

JavaScript

var elementDiv1=document.querySelector('.focusdv1');

var elementDivInDiv2=document.querySelector('#dind2');
var button1=document.querySelector('#focusdv1');
var button2=document.querySelector('#focusdv2');
var button3=document.querySelector('#focusdv3');
//button1.onclick=function(){alert('the click on button1 did this');};
button1.onclick=function(){clickHandler('focusdv1',elementDiv1);};
button2.onclick=function(){clickHandler('focusdv2',elementDiv2);};
button3.onclick=function(){clickHandler('focusdv3',elementDivInDiv2);};

var simpleHandler=function()
{
    alert('simple click handler handled this');
};

var clickHandler = function(buttonID,divObj)
{
    alert('A plain alert from in the clickHandler function');
    alert('The button with the ID: '+buttonID+' was clicked');
    divObj.scrollIntoView();
};
/**/
//alert('an alert @ the end');