No aplica style al utilizar name="area" como referencia de las etiquetas: ¿Qué sucede?
Javascript:
<script>
var area = document.getElementsByName("area").innerHTML;
if (area == "Superior") {
document.getElementsByName("area").style.backgroundColor = "#ff0000";
}
if (area == "Inferior") {
document.getElementsByName("area").style.backgroundColor = "#0000ff";
}
</script>
HTML:
<p name="area">Superior</p>
<p name="area">Inferior</p>
<p name="area">Inferior</p>
<p name="area">Superior</p>
getElements
, en plural. Son arrays y nadie tiene problema con ellos, exceptuando los que no lo saben aún. Otras opciones pueden ser usar jQuery