element.className returning null...

I am having trouble with the following code:
function set_registration_input_event() {
var inputs = document.getElementsByTagName("input");
for (i=0;i<=inputs.length;i++) {
if (inputs[i].className == "registration") {
inputs[i].onclick = function () {inputs[i].style.border = "#6fad00 solid 1px"};
inputs[i].onblur = function () {inputs[i].style.border = "#6a909e solid 1px"};
}
}
}

Error I recieve:
"'className' is null or not an object"

I've tested this on Avant Browser 11 build 43, using the IE 7.0.5730.11 engine.

What I am trying to do is set the onclick and onblur events to change the color of the input field borders for any input tag with "registration" as the class name.

If I'll put somthing like "alert(inputs[i].className)", it works just fine.

An example site can be found on my personal test server:
http://67.182.34.47/mihopa/login/register/

Try to change
i<=inputs.length
to
i<inputs.length

That is not the error I receive. But this code will do worlds better and not leave IE memory leaks.

function set_registration_input_event() {
var inputs = document.getElementsByTagName("input");
for (i=0;i<inputs.length;i++) {
if (inputs[i].className == "registration") {
inputs[i].onclick = function () {this.style.border = "#6fad00 solid 1px"};
inputs[i].onblur = function () {this.style.border = "#6a909e solid 1px"};
}
}
}

I am having trouble with the following code:
for (i=0;i<=inputs.length;i++)

Always use the var keyword. If i can equal length, it will index out of bounds.

inputs[i].onclick = function () {inputs[i].style.border = "#6fad00 solid 1px"};
inputs[i].onblur = function () {inputs[i].style.border = "#6a909e solid 1px"};


The value of i will be undefined/meaningless when that function is called. Should be:inputs[i].onclick = function () {this.style.border = "#6fad00 solid 1px"};

Thanks a lot for the help. Everything is working now. :)