document.getElementById e document.getElementsByTagName + ciclo for

<style>
.banana{
border: 5px solid #ff0000;
width: 200px;
}
</style>

<script>
function bordo(){
document.getElementById('bersaglio').className='banana';
}
</script>

--------------Questo con getElementByID---------------------------<br>
<p id="bersaglio">hhhhhh</p>

<input type="button" onclick="bordo()" value="bordo">
<input type="button" onclick="location.reload()" value="togli bordo"><br>


---------oppure tutti i paragrafi con contorno-----con--document....tagName--------------<br>

<script>
function bordi(){
totale=5;
i=0;
for(i=0;i<=totale;i++){
document.getElementsByTagName('p').item(i).className='banana';
}
}
</script>

<p>aaa</p>
<p>bbb</p>
<p>ccc</p>

<input type="button" onclick="bordi()" value="bordi">
<input type="button" onclick="location.reload()" value="togli bordo"><br>