Event.observe function - observe element by class instead of id

Question

There is prototype js function:

Event.observe(element, eventName, handler)

here the element means element's ID.

Is it possible to put here element's class?

I got this element from third party with class attribute only.

Answer 1

You could use a CSS selector:

Event.observe($$('.someClass'), eventName, handler);

Answer 2

$$ can retrieve elements by css selector, including by class via the period notation .:

$$('.myClass'); // array with all elements that have class "myClass"

To answer your question, Event.observe is the "static" version of observe (for all intents and purposes). As a convenience Prototype automagically makes .observe available off of all DOM elements (fetched with either $ or $$):

Examples:

// get one item by id with $ and attach an event listener:
$('myId').observe(eventName, handler);

// get many items by class with $$ and attach an event listener:
$$('.myClass').each(function(element) {
  element.observe(eventName, handler);
});

// or shorter:
$$('.myClass').invoke('observe', eventName, handler);