title: How to hide options of a select box using javascript
body: <p>I am adding options dynamically  to a select box using the below function . I want to hide the option when they are added. They would be shown on special condition. Can I hide the option. </p>
  
  <pre><code>function loadName(name)
  {
  
      var e=document.getElementById('templateName');
      var i =0;
      var abc = true;
      while(abc)
      {
          if (!e.options[i] || e.options[i].innerText==null)
          {
              abc =false;
          }
          else
          {
              i++
          }
      }
      e.options[i]= new Option(name ,name);
  
  }
  
  function loadName(name)
  {
  
      var e=document.getElementById('templateName');
      var i =0;
      var abc = true;
      while(abc)
      {
          if (!e.options[i] || e.options[i].innerText==null)
          {
              abc =false;
          }
          else
          {
              i++
          }
      }
      e.options[i]= new Option(name ,name);
  
  }
  </code></pre>
  
  <p>Actually there are three group of element which can be shown on basis of selection of other select box. my idea is to hide all and give a criteria on the basis of which it will be shown. Else I will make three different select box hide them all and will the select box available on the choice if I can't hide individual options</p>