Edit in JSFiddle

var veyeR = document.getElementById("eyeR");//Récupère l'élément id eyeR que je place dans une variable veyeR
var vtete = document.getElementById("tete");

veyeR.addEventListener("click",monterDescendre);
vtete.addEventListener("click",translation);

function monterDescendre(e){//Cette fonction récupère l'évenement du click sur l'oeil

	var robotPart = e.target;
	var pos = 0;
	var id = setInterval(frame,100)

	function frame(){
		robotPart.style.top = pos + '%';
		pos++;
		if (pos === 20) {
			clearInterval(id);
		}
	}

}

function translation(e){//Cette fonction récupère l'évenement sur la tête

	var move = e.target;
	var pos = 0;
	var id = setInterval(frame,100)

	function frame(){
		move.style.right = pos + '%';
		move.style.transform.rotate = 'pos' + 'deg';
		pos++;
		if (pos === 0) {
			clearInterval(id);
		}
	}

}

<p class="ex">Exercice 2:</p>

            <div id="tete"> 
                <div id="eyeR"></div>
                <div id="eyeL"></div>
                <div id="nose"></div>
                <div id="mouth"></div>
            </div>

#tete{
	position:relative;
	width:20%;
	height:20%;
	margin: 0 auto;
	background-color: #CCC;
	min-height: 100px;
	border-radius: 50%;
}

#eyeR{
	position:absolute;
	width:20%;
	height:20%;
	background-color: #000;
	border-radius: 50%;
	top:20%;
	left:20%;
}

#eyeL{
	position:absolute;
	width:20%;
	height:20%;
	background-color: #000;
	border-radius: 50%;
	top:20%;
	left:60%;
}

#nose{
	position:absolute;
	width:14%;
	height:30%;
	background-color:red;
	border-radius: 40%;
	top:40%;
	left:43%;
}

#mouth {
    position: absolute;
    width: 45%;
    height: 15%;
    left: 28%;
    top: 75%;
    background-color: orange;
}