title: Auto-scroll to a div when clicking on another div
body: <p>When I click on one of the smaller <code>div</code>s on the left (inside of the <code>div</code> with the class <code>"smallitems"</code>, I want for the <code>div</code> on the right (with the class <code>"items"</code>) to auto-scroll to the appropriate larger <code>div</code>.</p>
  
  <p><strong>HTML:</strong></p>
  
  <pre><code> &lt;div class="smallitems"&gt;
      &lt;div class="col"&gt;1&lt;/div&gt;
       &lt;div class="col"&gt; 2 &lt;/div&gt;
       &lt;div class="col"&gt; 3&lt;/div&gt;
       &lt;div class="col"&gt;4&lt;/div&gt;
       &lt;div class="col"&gt; 5 &lt;/div&gt;
       &lt;div class="col"&gt;6 &lt;/div&gt;
       &lt;div class="col"&gt; 7&lt;/div&gt;
      &lt;div class="col"&gt;8&lt;/div&gt;
   &lt;/div&gt;    
  
   &lt;div class="items"&gt;
      &lt;div class="item"&gt;1&lt;/div&gt;
      &lt;div class="item"&gt;2&lt;/div&gt;
      &lt;div class="item"&gt;3&lt;/div&gt;
      &lt;div class="item"&gt;4&lt;/div&gt;
      &lt;div class="item"&gt;5&lt;/div&gt;
      &lt;div class="item"&gt;6&lt;/div&gt;
      &lt;div class="item"&gt;7&lt;/div&gt;
      &lt;div class="item"&gt;5&lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p><strong>JavaScript (with JQuery):</strong></p>
  
  <pre><code>$('.smallitems .col').on("click", function(){
  
    //how use scroll items show
  
  });
  </code></pre>
  
  <p><strong>Example:</strong></p>
  
  <p>This is before I click on a <code>div</code> in the left <code>div</code> (<code>"smallitems"</code>).</p>
  
  <p><img src="https://i.stack.imgur.com/AWf0D.png" alt="Before clicking on the div"></p>
  
  <p>I've now clicked on the number 5 (<code>&lt;div class="col"&gt;5&lt;/div&gt;</code>) in the left <code>div</code>. As you can see the right <code>div</code> has scrolled to the 5th div (<code>&lt;div class="item"&gt;5&lt;/div&gt;</code>).</p>
  
  <p><img src="https://i.stack.imgur.com/3aQ6z.png" alt="Scrolling to the 5th div"></p>
  
  <p>Similar to the above, I've clicked on the number 4, and subsequently have had the right <code>div</code> auto-scroll to the 4th <code>div</code>.</p>
  
  <p><img src="https://i.stack.imgur.com/BT7Uh.png" alt="Scrolling to the 4th div"></p>
  
  <p>see jfiddle <a href="http://jsfiddle.net/h7bLK/" rel="nofollow noreferrer">http://jsfiddle.net/h7bLK/</a></p>