title: Why isn't selectedIndex working in this code?
body: <p>I have the following code:    </p>
  
  <pre><code>&lt;html&gt;
      &lt;head&gt;
  
     &lt;/head&gt;
    &lt;body&gt;
       &lt;select name="" id="dia"&gt;
          &lt;script&gt;
           var d = new Date();
           var selector = document.getElementById('dia');
  
           for(var i = 1; i &lt; 32; i++){
               var toprint = "&lt;option&gt;"+i+"&lt;/option&gt;";
               document.write(toprint);
               if(i==d.getDate()){  
                   selector.selectedIndex = i
               }
           }
  
           &lt;/script&gt;
       &lt;/select&gt;
          &lt;select name="" id="mes"&gt;&lt;/select&gt;
          &lt;select name="" id="anyo"&gt;&lt;/select&gt;
  
     &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>The select element is filled by options as expected, but the index is not properly set. I've tried every component in separate, and I don't get why it isn't working.:</p>
  
  <ul>
  <li><code>selector.selectedIndex</code> works when I use it in console</li>
  <li><code>i</code> is obviously a valid number since it's iterating in the loop.</li>
  <li>The <code>Javascript console</code> doesn't show any error or exception. So I assume there are no typos.</li>
  <li>Placing an alert inside the <code>if</code>, it does work. So I assume the code is entering the <code>if</code> clause.</li>
  <li>I thought that maybe the index was being rewritten after every write, but I've tried placing <code>selectedIndex</code> outside the loop and it doesn't work either.</li>
  </ul>
  
  <p>So... What am I missing?? I'm really out of ideas.</p>