title: Show div based on select option value
body: <p>I have 5 divs for example</p>
  
  <pre><code>&lt;div class="group" id="div1"&gt;Div1&lt;/div&gt;
  &lt;div class="group" id="div2"&gt;Div2&lt;/div&gt;
  &lt;div class="group" id="div3"&gt;Div3&lt;/div&gt;
  &lt;div class="group" id="div4"&gt;Div4&lt;/div&gt;
  &lt;div class="group" id="div5"&gt;Div5&lt;/div&gt;
  </code></pre>
  
  <p>Then I have a select control:</p>
  
  <pre><code>&lt;select id="mySelect"&gt;
  &lt;option value="1"&gt;1&lt;/option&gt;
  &lt;option value="2" selected="selected"&gt;2&lt;/option&gt;
  &lt;option value="3"&gt;3&lt;/option&gt;
  &lt;option value="4"&gt;4&lt;/option&gt;
  &lt;option value="5"&gt;5&lt;/option&gt;
  &lt;/select&gt;
  </code></pre>
  
  <p>Then what I want to do: when "3" is selected in mySelect control, I want to display the first 3 divs, when "5" is selected, I want to display all divs. Additionally, the initial value of select is for example "2", then when a page is load, I want to display first 2 divs. How can I achieve this?</p>