title: Uncaught TypeError: Cannot read property 'top' of undefined
body: <p>I have some jQuery code like this</p>
  
  <pre><code>$(document).ready(function(){
      $('.content-nav a').on('click',function(){
        var str = $(this).attr("href");   
        var the_id = str.substr(1);
          $("#container").animate({ scrollTop: $(the_id).offset().top }, 1000);
      });
  });
  </code></pre>
  
  <p>When I click the link i'm getting error like <code>Uncaught TypeError: Cannot read property 'top' of undefined</code></p>
  
  <p>Can someone tell me whats wrong?</p>
  
  <p>I'm using jQuery 1.8.3 which is loaded from google api.</p>