Javascript Element How to - Click p element to change header

Question

We would like to know how to click p element to change header.

Answer


<!DOCTYPE html>
<html>
<head>
<script type='text/javascript'>
window.onload=function(){<!--  ww  w .  j a  va  2  s  .c o  m-->
document.querySelector("#right").addEventListener("click", funcRight);
function funcRight() {
    var month = document.getElementsByTagName("h4").item(0);
    if (month.innerHTML == "August 2014"){
        month.innerHTML="September 2014";
    } else if (month.innerHTML == "September 2014"){
        month.innerHTML="October 2014";
    }
}
}
</script>
</head>
<body>
  <h4 align="center">August 2014</h4>
  <p id="right">next</p>
</body>
</html>

The code above is rendered as follows: