html – Why is the second element with the same id being painted?

Question:

I put the same id on two elements. Why is the second one being painted?

#red {
  color: red;
}

<span id="red"> red </span> no red <span id="red"> red </span>

In the case of CSS, id behaves like a class, but in JavaScript it will only apply to the first element:

document.getElementById("red").style.color = "red";

<span id="red"> red </span> no red <span id="red"> red </span>

Post Views: 1