Мне кажется, это работает:
<html>
<head><style>
#monkey {color:blue}
#ape {color:purple}
</style></head>
<body>
<span id="monkey" onclick="changeid()">
fruit
</span>
<script>
function changeid ()
{
var e = document.getElementById("monkey");
e.id = "ape";
}
</script>
</body>
</html>
Ожидаемое поведение - изменить цвет слова «фрукты».
Возможно, ваш документ не был полностью загружен, когда вы вызывали процедуру?