В том виде, в котором Вы изложили свой пример - это не javascript. Это HTML. В большинстве случаев содержимое формы (в т.ч. поля INPUT) отправляется на сервер, проверяется на сервере на корректность введенных данных и отправляется обратно уже измененный html-код формы, в т.ч. с сообщением об ошибке выделенным цветом. При формировании этого кода на сервере класс "d1" (с display:none) подменяется на "d2" (с display:block), а в <span> вставляется текст ошибки. Это называется с перезагрузкой страницы.
Если же Вы хотите всё это делать без перезагрузки страницы, если Вы хотите делать проверку корректности введенных данных прямо на клиентской стороне (без отправки данных на сервер), то необходимо:
1. написать JavaScript создания (create) Вашей формы и навесить обработчики событий на отправку формы (submit), либо на событие нажатия клавиш INPUT (onkeydown).
2. если принципиально надо оставить html-код формы, то сначала снабдите необходимые теги формы корректными идентификаторами, например,
<div id="mama">.....</div>...<span id="papa">.....</span>
Затем, используя document.getElementById("mama") найти на форме необходимые элементы и в javascript опять же навесить на них функции (смены класса, проверки ввода и т.д.)
примечание: не используйте в качестве идентификатора слово "name" - будут проблемы...
3. Выбрать способ который будет отправлять данные на сервер. Например, можно использовать XMLHttpRequest, в котором на событие onreadystatechange повесить функцию, которая наконец изменит класс необходимого DIV_a, т.е. сделает это:
document.getElementById("mama").className = "d2";
Вот и все "семечки".