title: How do I programatically select an HTML option using JavaScript?
body: <p>I have option menu like this:</p>
  
  <pre><code>&lt;form name="AddAndEdit"&gt;
     &lt;select name="list" id="personlist"&gt;
        &lt;option value="11"&gt;Person1&lt;/option&gt;
        &lt;option value="27"&gt;Person2&lt;/option&gt;
        &lt;option value="17"&gt;Person3&lt;/option&gt;
        &lt;option value="10"&gt;Person4&lt;/option&gt;
        &lt;option value="7"&gt;Person5&lt;/option&gt;
        &lt;option value="32"&gt;Person6&lt;/option&gt;
        &lt;option value="18"&gt;Person7&lt;/option&gt;
        &lt;option value="29"&gt;Person8&lt;/option&gt;
        &lt;option value="28"&gt;Person9&lt;/option&gt;
        &lt;option value="34"&gt;Person10&lt;/option&gt;
        &lt;option value="12"&gt;Person11&lt;/option&gt;
        &lt;option value="19"&gt;Person12&lt;/option&gt;
     &lt;/select&gt;
  &lt;/form&gt;
  </code></pre>
  
  <p>And now I want to change the selected option by using an href. For example:</p>
  
  <pre><code>&lt;a href="javascript:void(0);"
    onclick="document.getElementById('personlist').getElementsByTagName('option')[11].selected = 'selected';"&gt;change&lt;/a&gt;
  </code></pre>
  
  <p>But I want to select the option with <code>value=11 (Person1)</code>, not <code>Person12</code>.</p>
  
  <p>How do I change this code?</p>