スニペットで再現する事を確認済みです。
コードの中のコメントの通りですが、new xNode(1) new xNode(2) new xNode(3)と擬似クラスのインスタンスを作り、その中でコールバックを指定しています。
それぞれ別のインスタンスなので、new xNode(1)の中では常にパラメーターは1であって欲しいのですが、何故か最後の3で全て上書きされてしまいます。

http://qiita.com/ukiuni@github/items/463493a690265cec8bb7
この記事に書かれている事と似ていると思うのですが、newしているので違う話だと判断しています。
コードの切り出しはしたのですが、それでもこの長さになってしまいました。
new xNode(id);で指定したidの変数をコールバックから使うにはどうしたらよいでしょうか。よろしくお願いします。
chrome 47で確認をしました。

<script>
br=function(){return document.createElement("br");};
nodes=[];
window.addEventListener("DOMContentLoaded", function(){
 xtest=(function(){
  var proto=Object.create(HTMLElement.prototype, {
   createdCallback: {
    value: function() {
     var t = document.querySelector('template');
     var clone = document.importNode(t.content, true);
     var shadowRoot=this.createShadowRoot();
     shadowRoot.appendChild(clone);
     this.cb=function(){};
     this.setCallback=function(ccc){
      cb=ccc;
     };
     this.callCallback=function(){
      cb();
     };
     this.setButtonText=function(name){
      this.shadowRoot.querySelector("#push").innerText=name;
     };
    }
   },
   attachedCallback : {
    value: function(){
     this.shadowRoot.querySelector("#push").addEventListener("click",this.callCallback);
    }
   },
   attributeChangedCallback : {
    value: function(attrName, oldVal, newVal){
    }
   },
   detachedCallback : {
    value: function(){
    }
   },
  });
  return document.registerElement('x-test',{prototype:proto});
 })(); // (0)ここでx-testのカスタムhtmlタグを登録
 newCreate(1); // (1)パラメーターが違う3つの処理
 newCreate(2);
 newCreate(3);
}, false);
function newCreate(id){
 var addNew=new xNode(id); // (2)ここでnew xNodeとしている！
 nodes.push(addNew);
 document.body.appendChild(addNew.dom());
 document.body.appendChild(br());
}
function xNode(id){// (3)このメソッドは常にnew xNode(id)でコールされているから、変数idやalertTextはそれぞれ違うスコープを持って欲しい
 var node;
 var alertText=id+"です";
 var init=function(){ // (4)一番下のinitから来て・・・ xtestのカスタムhtmlタグのインスタンスを作る。
  node=new xtest();
  node.setButtonText(alertText);
  node.setCallback(function(){
   alert(alertText);//(5)ボタンが押されたらここに処理が来る。alertTextが常に"3です"になるのは何故？
  });
 };
 this.number=function(){
  return node.number;
 };
 this.dom=function(){
  return node;
 };
 this.callCallback=function(){
  node.callCallback();
 };
 init();
};
</script>
<template id="cells-to-repeat">
 <label><button id="push"></button></label>
</template>
どれを押しても「3です」としか表示されない。<br>