To dynamically chage font the label text whenever mouse located on label

<style>
#highlighter {
    width: 250px;
    height: 100px;
    border: 1px solid red;
    position: absolute;
    display: table;
    text-align: center;
}

#highlighter p {
    vertical-align: middle;
    display: table-cell;
}

.h_down p {
    font-size: 30px;
}

.h_up p {
    font-size: 50px;
}
</style>
<script>
function up(element) {
    element.className="h_up";
}

function down(element) {
    element.className="h_down";
}
</script>
<div id="highlighter" class="h_down" onmouseover="up(this);" onmouseout="down(this);"><p>let's see</p></div>