動的にonclickを追加する

解決ではなく、悩みです。
基本となるhtml

<div id="hoge"></div>
<button onclick="hogera();">押して</button>

IEの場合

function hogera()
{
  var element = document.getElementById('hoge');
  var e = document.createElement('button');
  e.innerHTML = 'ボタン';
  var f = new Function("alert('ok');");
  e.setAttribute('onclick', f);
  element.appendChild(e);
}

FireFoxの場合

function hogera()
{
  var element = document.getElementById('hoge');
  var e = document.createElement('button');
  e.innerHTML = 'ボタン';
  var f = "alert('ok');";
  e.setAttribute('onclick', f);
  element.appendChild(e);
}

どっちが正しい動きかといえば、もちろん、FireFox。
では、どっちでも動く方法って無いの？

これで両方で動く。

function hogera()
{
  var element = document.getElementById('hoge');	
  var e = document.createElement('button');
  e.innerHTML = 'ボタン';
  var f = new Function("alert('ok');");
  e.onclick = f;
  element.appendChild(e);
}

ただし、弱点がある。
このコーディングだと、FireBugで見た時に、onclickイベントが見れないんです！
隠蔽にはなるけど、超デバッグしにくい・・・