jquery - Zepto で要素の可視性を切り替えます

Question

HTML:

<a id="the_link" class="folded" href="#">Click me</a>
<div id="content">This is some content to be toggled.</div>

それぞれコンテンツを表示または非表示にする 2 つの関数:

function shower() {
  $("body").on("click", "#the_link.folded", function(event) {
    $("#content").show();
    $("#the_link").html("Hde info").removeClass("folded").addClass("unfolded");
  });
}

function hider() {
  $("body").on("click", "#the_link.unfolded", function(event) {
    $("#content").hide();
    $("#the_link").html("See more info").removeClass("unfolded").addClass("folded");
  });
}

jQuery を使用すると、コードは機能します。

$(document).ready(function() {  
  shower();
  hider();
})

Zepto を使用すると、コードが機能しません。

Zepto(function($){  
  shower();
  hider();
})

なんで？