Active parent

<html>
<head>
<style type='text/css'>

div:active {
    background-color:orange;
}

div:focus {
    outline:none;
}


</style>
<script type='text/javascript'>
window.onload = function() {
    var allSpans = document.getElementsByTagName('span');

    for(var x = 0; x < allSpans.length; x++) {
        allSpans[x].parentNode.setAttribute('tabIndex',0); // this might not be required
        allSpans[x].onclick = function() {
            this.parentNode.focus();
        }
    }
}
</script>
</head>

<body>


<div style='width:100px; border: 1px solid black'>
    <span>Line 1</span>
</div>

<div style='width:100px; border: 1px solid black'>
    <span>Line 2</span>
</div>
<div style='width:100px; border: 1px solid black'>
    <span>Line 3</span>
</div>

</body>

</html>