focus не работает

[Alina25]

Подскажите пожалуйста, в чем ошибка. Есть два блока, блок с поиском, и блок с всплывающей подсказкой, который по умолчанию на видимый и должен появляться под блоком с поиском, только при событии фокус. .vvod - блок с поиском, .word - подсказка
Но не работает!(

HTML код:
<form class="fo">
<input class="vvod" type="text">
<input class="but" type="image" src="img/button.png">
</form>

<div class="word"></div>

Css код:
.word{background:url(img/word.png) no-repeat; width:400px; height:45px; display:none;}
.vvod{width:287px; height:22px; margin-top:7px; margin-left:12px; border:white; display:block; float:left; font-size:95%; color:#797979;
}


Скрипт:
<script>
document.getElementByClass('vvod').onfocus = function() {
document.geteElementByClass('word').style.display = 'inline';
}
</script>

[danik.js]

getElementByClass

Че за метод? Где о нем узнали?

geteElementByClass

Зажмите Ctrl и покрутите колесиком мыши вверх.

[Alina25]

HTML код:
<form class="fo">
<input id="vvod" type="text">
<input class="but" type="image" src="img/button.png">
</form>

<div id="word"></div>

Css код:
#word{background:url(img/word.png) no-repeat; width:400px; height:45px; display:none;}
#vvod{width:287px; height:22px; margin-top:7px; margin-left:12px; border:white; display:block; float:left; font-size:95%; color:#797979;
}


Скрипт:
<script>
document.getElementById('vvod').onfocus = function() {
document.geteElementById('word').style.display = 'block';
}
</script>
Все равно не работает

[Alina25]

*
Скрипт:
<script>
document.getElementById('vvod').onfocus = function() {
document.getElementById('word').style.display = 'block';
}
</script>

[danik.js]

Почему. Все работает как и задумывалось:

<style>
#word{
    /*background:url(img/word.png) no-repeat;*/
    background: rgba(0,0,255,0.2);
    width:400px;
    height:45px;
    display:none;
}
#vvod{
    width:287px;
    height:22px;
    margin-top:7px;
    margin-left:12px;
    border:white;
    display:block;
    float:left;
    font-size:95%;
    color:#797979;
}
</style>

<form class="fo">
<input id="vvod" type="text">
<input class="but" type="button" value="Жоп" />
</form>

<div id="word">Подсказка</div>
<script>
document.getElementById('vvod').onfocus = function() {
    document.getElementById('word').style.display = 'block';
}
</script>

[Alina25]

Подсказка не срабатывает, даже на вашем примере. Возможно дело в браузере?

[Alina25]

и onfocus должен был срабатывать в области для ввода текста... а не при нажатии на кнопку

[danik.js]

Ставлю курсор в поле ввода - появляется подсказка. Работает в хроме и лисе точно.

[Alina25]

Спасибо! Уже все работает! Подскажите пожалуйста, кто-нибудь, где можно промотреть примеры реализации подобного скрипта, но с использованием class вместо id

[danik.js]

document.querySelector('.vvod')