jQuery scripts not working on my Drupal theme This script from JSFiddle that works: https://jsfiddle.net/ryXFt/704/

Does not work in my Drupal theme (yes, it does load, I can see it via Firebug). All I do is just wrap up the code to match Drupal rules.

(function ($) {
  Drupal.behaviors.yourBehaviorName = {
    attach: function (context, settings) {
        $("#block-menu-menu-mobile ul li .nolink").click(function() {
            $('html,body').animate({
                scrollTop: $(".region-front-calander").offset().top},
                'slow');
        });
    }
  };
})(jQuery);


When clicked, console gives TypeError: $(...).offset(...) is null for line that contains scrollTop: $(".region-front-calander").offset().top},

HTML

&lt;html&gt;
    &lt;body&gt;
        &lt;div id="page"&gt;
            &lt;div id="main"&gt;
                &lt;div id="content" class="column" role="main"&gt;
                    &lt;div class="region region-highlighted"&gt;
                        &lt;div id="block-menu-menu-mobile" class="block block-menu first odd" role="navigation"&gt;
                            &lt;ul class="menu"&gt;
                                &lt;li class="first leaf"&gt;
                                    &lt;span class="nolink" title=""&gt;Calendar&lt;/span&gt;
                                &lt;/li&gt;
                            &lt;/ul&gt;
                        &lt;/div&gt;
                    &lt;/div&gt;
                    &lt;div class="region region-front-calendar"&gt;&lt;/div&gt;
                &lt;/div&gt;
            &lt;/div&gt;
        &lt;/div&gt;
    &lt;/body&gt;
&lt;/html&gt;
Looks like your classes aren't matching up. I'm guessing that the ideal action you want is when you click on the calendar link, it brings the region-front-calendar up. 

The issue looks like your js isn't doing anything to that region, rather it's attempting to pull up a class called "second" which dosn't exist in the html snippet you posted.

If you switch that to the region-front-calander, that might be the answer your looking for.

(function ($) {
  Drupal.behaviors.yourBehaviorName = {
    attach: function (context, settings) {
        $("#block-menu-menu-mobile ul li .nolink").click(function() {
            $('html,body').animate({
                scrollTop: $(".region-front-calander").offset().top},
                'slow');
        });
    }
  };
})(jQuery);