javascript et <video>

Bonjour tous ,
voici un petit html qui ne marche pas :

Code:

1
2
3
4
5
6
7
8
9
<video id="media" width="400px" height="600px">
	<source src="doudou.webm" type="video/webm"/>
	<source src="doudou.mp4" type="video/mp4"/>
	vidéo cannot be displayed
</video>
<div>
	<button>play</button>
	<button>pause</button>
</div>

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
var mediaElem = getElementById("media");
var bouttons = getElementsByTagName("button");
for(var i=0;i<bouttons.length;i++){
	bouttons[i].onclick = handleButtonPress;
}
function handleButtonPress(e){
	switch(e.target.innerHTML){
		case "play":
			mediaElem.play();
			break;
		case "pause":
			mediaElem.pause();
			break;
	}
}

les bouttons "Play" et "Pause" ne fonctionne pas. Pourquoi ?