HTML id Global Attribute - Playground Example

<!DOCTYPE html>
<html>
<head>
   <title>Global Attribute id</title>
<style> 
#main {
   text-align:center;
   color:red;
}
#index {
   color:blue;
}
</style>
</head>
<body>
   <h1 id="main">First level heading.</h1>
   <p id="index">Paragraph with assigned id as a style identifier.</p>
   <a href="#main">Using id as an anchor</a> (throws to the specified id).
   <p>Using JavaScript scripts (changing elements with a specific id):</p>
<script>
   function chg() {
      var x = document.getElementById("main");
      x.style.color = "white"; 
      x.style.backgroundColor = "orange"; 
   }
</script>
   <button onclick="chg()">Click!</button>
</body>
</html>