Mega Code Archive

 
Categories / JavaScript Tutorial / Form
 

Modifying optgroup Element Labels

< html>  <head>  <title>Color</title>  <script type="text/javascript">  var naturalLabels = ["G1","G2","G3"];  function myFlag(list) {      var optGrps = list.getElementsByTagName("optgroup");      for (var i = 0; i < optGrps.length; i++) {          optGrps[i].label = naturalLabels[i];      }  }  </script>  </head>  <body onload="seeColor(document.getElementById('colorsList'))">  <form>  <select name="colorsList" id="colorsList" onchange="seeColor(this)">      <optgroup id="optGrp1" label="Reds">      <option value="#ff9999">Light Red</option>          <option value="#660000">Dark Red</option>      </optgroup>      <optgroup id="optGrp2" label="Greens">          <option value="#ccff66">Light Green</option>      </optgroup>           <optgroup id="optGrp3" label="Blues">          <option value="#ccffff">Light Blue</option>      </optgroup>  </select> <input type="radio" name="labels"  onclick="myFlag(this.form.colorsList)" />Set Label</p>  </form>  </body>  </html>