title: simpliest increase - decrease value options in select area using jquery
body: <p>at the beginning I want to say that I am a novice in jquery. 
  I want to create an  field, which will contain years. Also I want to make two arrows left, and right. After clicked they should change values in my select field - in increasing and decreasing way. Whenever the text which is inside each option. </p>
  
  <p>My current code prepared just to show You this looks like: </p>
  
  <p><strong>HTML</strong>
      </p>
  
  <pre><code>    &lt;a href="#" title=""&gt;
          &lt;img src="https://cdn3.iconfinder.com/data/icons/google-material-design-icons/48/ic_keyboard_arrow_left_48px-128.png" alt="" /&gt;
      &lt;/a&gt;
      &lt;a href="#" title=""&gt;
          &lt;img src="https://cdn3.iconfinder.com/data/icons/google-material-design-icons/48/ic_keyboard_arrow_right_48px-128.png" alt="" /&gt;
      &lt;/a&gt;
  
      &lt;br /&gt;
  
      &lt;select class="my-select"&gt;
          &lt;option selected value="select"&gt;2015&lt;/option&gt;
          &lt;option&gt;2014&lt;/option&gt;
          &lt;option&gt;2013&lt;/option&gt;
          &lt;option&gt;2012&lt;/option&gt;
      &lt;/select&gt;
  
  &lt;/div&gt;
  </code></pre>
  
  <p><strong>CSS</strong></p>
  
  <pre><code>.wrapper {
      width: 300px;
      margin-left: auto;
      margin-right: auto;
      text-align: center;
  }
  
  .my-select {
      width: 200px;
      height: 50px;
      line-height: 50px;
      border: 1px solid #000000;
      text-indent: 30px;
  }
  </code></pre>
  
  <p>and the fiddle is here:
  <a href="http://jsfiddle.net/6uLxp1hx/" rel="nofollow">http://jsfiddle.net/6uLxp1hx/</a></p>