[Javascript]Hide controls of HTML5 <video>

HTML

<video id="myvideo" width="300" height="250" >
    <source src="http://www.jplayer.org/video/m4v/Big_Buck_Bunny_Trailer.m4v" />
</video>

<p onclick="toggleControls();">Toggle</p>

JavaScript

var video = document.getElementById("myvideo");

function toggleControls() {
  if (video.hasAttribute("controls")) {
     video.removeAttribute("controls")   
  } else {
     video.setAttribute("controls","controls")   
  }
}