onfocusでツールチップ表示

久しぶりにJavaScriptです。
テキストボックス等でフォーカスがあたった時にツールチップを表示するコードを考えてみました。

var addListener = ( window.addEventListener ?

    function(elm, event, func){

        elm.addEventListener(event, func, false);

    } :

    function(elm, event, func){

        elm.attachEvent('on' + event, func); //IE

    }

);
/* ツールチップを生成 */

var createTip = function() {

    var element = document.createElement('div');

    element.id = "carender_tip";

    element.innerHTML = "hogehoge";

    element.style.backgroundColor = 'white';

    element.style.visibility = 'hidden';        /* 表示を隠しておく */

    var objBody = document.getElementsByTagName("body").item(0);

    objBody.appendChild(element);               /* bodyの子要素として追加 */

}
/* ツールチップの表示 */

var visibleTip = function() {

    var element = document.getElementById('carender_tip');

    var top = this.offsetTop;                       /* 対象要素のTOP座標 */

    var left = this.offsetLeft + this.offsetWidth;  /* 対象要素のLEFT座標 + 横幅 */

    element.style.position = 'absolute';

    element.style.top = top + "px";                 /* チップのTOP座標(pxは必須) */

    element.style.left = left + "px";               /* チップのLEFT座標(pxは必須) */

    element.style.visibility = 'visible';

}
/* ツールチップの非表示 */

var hiddenTip = function() {

    var element = document.getElementById('carender_tip');

    element.style.visibility = 'hidden'

}
/* 表示／非表示のイベントを設定 */

var addEvent = function(){

    var classname = "gfycar";

    createTip();

    var a = document.getElementsByClassName(classname); /* 所定のクラス名のリストを取得 */

    for (i = 0; i