Having more than one element with the same ID is a hard to troubleshoot problem. The HTML parser will usually try to render the page in any case. Usually no error occurs. But the pace could end up in a mis-behaving web page.

In this example:

<div id="aDiv">a</div>
<div id="aDiv">b</div>

CSS selectors still work

#aDiv {
    color: red;
}

But JavaScript fails to handle both elements:

var html = document.getElementById("aDiv").innerHTML;

In this casehtml variable bears only the first div content ("a").

Syntax

• class="class1 class2 class3"
• id="uniqueid"

Parameters

Remarks

• Both class and id are global attributes, and may therefore be assigned to any HTML element.
• Class names must begin with a letter (A-Z or a-z) and can be followed by letters, digits , hyphens and underscores.
• In HTML5, the class and id attributes can be used on any element. In HTML 4.0.1, they were off-limits to the <base>, <head>, <html>, <meta>, <param>, <script>, <style> and <title> tags.
• An element can have one or more classes. Classes are separated by spaces and cannot contain spaces themselves.
• An element can have only one ID and it must be unique within its context (i.e. a webpage). IDs also cannot contain spaces themselves.