<!DOCTYPE html>
<html>
<head>
<title>Colorier</title>
</head>
<body>
<input type="text" id="text"/>
<select name="color1" id="color1">
<option value="red">Rouge</option>
<option value="green">Vert</option>
<option value="blue">Bleu</option>
</select>
<select name="color2" id="color2">
<option value="red">Rouge</option>
<option value="green">Vert</option>
<option value="blue">Bleu</option>
</select>
<select name="color3" id="color3">
<option value="red">Rouge</option>
<option value="green">Vert</option>
<option value="blue">Bleu</option>
</select>
<button type="button" id="color">Colorier</button>
<script>
function colorier() {
var text = document.getElementById("text").value;
var colors = [document.getElementById("color1").value, document.getElementById("color2").value, document.getElementById("color3").value];
for (var i = 0; i < text.length; i++) {
text[i] = colors[Math.floor(Math.random() * colors.length)];
}
document.getElementById("text").value = text;
}
</script>
</body>
</html>