title: JQuery sets multiple dropdown options to selected
body: <p>I have run into an interesting little problem that is probably just me being silly.</p>
  
  <p>I have a select box that looks a little like this:</p>
  
  <pre><code>&lt;select id="dom_" name="dom_"&gt;
      &lt;option value="1"&gt;1&lt;/option&gt;
      &lt;option value="2"&gt;2&lt;/option&gt;
      &lt;option value="3"&gt;3&lt;/option&gt;
      &lt;option value="4"&gt;4&lt;/option&gt;
      ...
  </code></pre>
  
  <p>The options represent days of the month and go up to 31.</p>
  
  <p>Now, I was trying to select a default value when the a form with information is loaded (for editing), but I couldn't get it to work quite right.</p>
  
  <p>I tried using this snippet I found in some previous SO questions:</p>
  
  <pre><code>$("#dom_ option[value$='" + 2 + "']").attr('selected', true);
  </code></pre>
  
  <p>This line runs and it sets the 2nd option to selected, but it also sets other 2X or X2 options to selected as well. For example, 12 and 22 will also be set to selected.</p>
  
  <p>If however, I use this:</p>
  
  <pre><code>$("#dom_ option").each(function()
  {
      if ($(this).val() == 2)
      {
          $(this).attr('selected', true);
      }
      else
      {
          $(this).attr('selected', false);
      }
  
  });
  </code></pre>
  
  <p>Then the right option will get selected, but the <code>SELECT</code> box will not be updated.</p>
  
  <p>I have to manually call <code>$("#dom_").val(2);</code> afterwords to update the box.</p>
  
  <p>So, my question is, why does the first option not work and why does the second one not auto refresh? </p>
  
  <p>Also, what exactly is the difference between taking a <code>SELECT</code> object via <code>$("#dom_")</code> and calling <code>.val</code> on it versus taking an option and setting <code>selected</code> to true? Do both of these send back the same <code>POST</code> or <code>GET</code> data?</p>
  
  <p>Here is a <a href="http://jsfiddle.net/xMC6x/" rel="noreferrer">jsFiddle</a> that hopefully demonstrates this. </p>
  
  <p>If it helps, I am using JQuery 1.6.4 but I could reproduce the same problem on some newer versions in jsFiddle.</p>
  
  <p>I apologize if this question is too simple. I am still quite an amateur when it comes to JavaScript and JQuery.</p>