interstitialSection error, unrecongnized expression

Things are working fine until I add a class. Here's a partial JS snippet

` $.scrollify({ section: $section, sectionName: 'section-name', interstitialSection: ".section-default-height", easing: 'easeOutExpo', scrollSpeed: 1100, offset: 0, scrollbars: true, standardScrollElements: '', setHeights: true, overflowScroll: true, updateHash: false, touchScroll: false, before: function (i, panels) { var ref = panels[i].attr('data-section-name');

    $('.sectionScroll-item--button').removeClass('on');

    $('a#ssi-' + ref).addClass('on');
    //$('.section-scroll').find('a[id="ssi-' + ref + '"').addClass('on');

  },
  after: function () {
    // we need to update incase there are any expandable element on the page
    $.scrollify.update();
  },
  afterResize: function () {},
  afterRender: function () {
    var $scrollNavItem = '';
    var activeClass = '';
    var $sectionScrollNav = '';

    $('.panel').each(function (i) {
      var $this = $(this),
        $id = $this.attr('data-section-name'),
        $title = $this.attr('title');

      // reset active class to ensure all the pips are not active on load
      activeClass = ''

      if (i === 0) {
        activeClass = 'on'
      }

      $scrollNavItem += '<li class="section-scroll-item"><a href="#' + $id + '" id="ssi-' + $id + '" role="button" aria-controls="' + $id + '" class="sectionScroll-item--button ' + activeClass + '" rel="nofollow" role="button" data-sectionid="' + $id + '"><span class="text">' + $title + '</span><span class="icon"> ' + $pipSVG + ' </span></a></li>';

    });
    $sectionScrollNav = '<nav class="section-scroll"><ul>' + $scrollNavItem + '</ul></nav>'
    $('main').append($sectionScrollNav);
    $(".section-scroll-item a").on("click", $.scrollify.move);
  }
});`

The class 'section-default-height is getting applied through the CMS, but any string I add causes the same error. I'm loading in version 1.019.

lukehaas / Scrollify

interstitialSection error, unrecongnized expression #366