setIntervalとclearInterval

setIntervalで設定した挙動を停止にはclarIntervalを使うのですが、下記のような記述では停止できません。

var i = 0;
setInterval(function(){
console.log(i++);
},1000);

$("button").on("click", function(){
clearInterval();
});

こちらも停止しません。

var i = 0;
function loop(){
  setInterval(function(){
      $("#result").text(i++);
    },1000);
}

loop();

$("#stop").on("click", function(){
  clearInterval(loop);
});

ちょっとはまったのですが、こちらで解決しました。
変数にして停止する方法です。

var w = setInterval(loop, 1000);

var i = 0;
function loop(){
  $("#result").text(i++);
}

$("#start").on("click", function(){
  w = setInterval(loop, 1000);
});

$("#stop").on("click", function(){
  clearInterval(w);
});

動作はこちらでご確認ください。

See the Pen setintervalとclearinterval by This is standard (@koutafunahashi) on CodePen.