var W3CDOM = document.createElement && document.getElementsByTagName;

function init() { // this function must be called after all textareas are drawn 
    setMaxLength();
}

function setMaxLength() {
    if (!W3CDOM) return;
    var textareas = document.getElementsByTagName("textarea");
    var counter = document.createElement('div');
    counter.className = 'counter';
    for (var i=0;i<textareas.length;i++) {
        if (textareas[i].getAttribute('maxlength')) {
            var counterClone = counter.cloneNode(true);
            counterClone.innerHTML = '<span>0</span>/'+textareas[i].getAttribute('maxlength')+ ' maximum length.';
            textareas[i].parentNode.insertBefore(counterClone,textareas[i].nextSibling);
            textareas[i].relatedElement = counterClone.getElementsByTagName('span')[0];
            textareas[i].onkeyup = textareas[i].onchange = checkMaxLength;
            textareas[i].onkeyup();
        }
    }
}

function checkMaxLength(){
    var mlength=this.getAttribute? parseInt(this.getAttribute("maxlength")) : ""
    if (this.getAttribute && this.value.length>mlength)
        this.value=this.value.substring(0,mlength);
    this.relatedElement.firstChild.nodeValue = this.value.length;
}