добавить событие onclick для различных элементов на основе класса CSS

Question

У меня есть различные элементы на одной странице. Они разделяют один класс. Я хочу добавить событие onclick для всех этих элементов, используя прототип.

Для идентификатора я могу сделать что-то вроде этого

Event.observe(window, 'load',
   function() {
$('id_of_the_element').addEventListener('onclick',any_function,true);
  }
);

Это хорошо, если у нас есть идентификатор элемента. Я хочу сделать то же самое с использованием класса css, потому что все элементы имеют общий класс.

Обновление:

document.observe("dom:loaded", function() {
   $$('.message').invoke('observe', 'click', hide_all_messages)
});

function hide_all_messages()
{
$$('.message').hide();
}

Это не работает.

ошибка:

   hide is not a function

Answer 1

более кратким решением было бы использовать invoke :

$$('.elements').invoke('observe', 'click', yourfunction)

Вы можете настроить его на запуск, когда dom будет готов, поместив его в этот код:

document.observe("dom:loaded", function() {
    $$('.elements').invoke('observe', 'click', yourfunction)
});

РЕДАКТИРОВАТЬ - это решит другую проблему:

function hide_all_messages(){
    $$('.message').invoke("hide");
}

Answer 2

$$('.myClass').each(
  function(element){
    Event.observe("click",element,any_function);
}
);

ты понял!