Как сослаться на идентификатор элемента html, указанный в visualforce, и передать его в функцию javascript?

У меня есть тег apex, который генерирует текстовое поле ввода.

<apex:page id="my_page">
    <apex:inputText id="foo" id="c_txt"></apex:inputText>
</apex:page>

Когда кто-то щелкает это поле, я хочу выполнить javascript.

Но когда я проверяю исходный HTML, этот верхний тег, который становится входным тегом, имеет (я думаю) динамически сгенерированную часть.

   <input type="text" size="50" value="Tue Nov 16 00:00:00 GMT 2010" 
name="j_id0:j_id3:j_id4:c_txt" id="j_id0:j_id3:j_id4:c_txt">

Как вы можете видеть, id имеет нежелательную часть: (

id="j_id0:j_id3:j_id4:c_txt"

В моем Javascript я пытаюсь getElementById (' c_txt ') , но это, конечно, не работает. Как с этим бороться ???

ОБНОВЛЕНИЕ

Кажется, я могу это сделать, но не работает ...

<apex:includeScript value="{!URLFOR($Resource.datepickerjs)}"></apex:includeScript>

<apex:inputText id="foo" id="c_txt" onclick="javascript:displayDatePicker()" />

datepickerjs

var elem = getElementById('c_txt');
alert(elem);

Предупреждение показывает "null", значит, что-то не так.

Даже это предупреждение возвращает null ...

var targetDateField = document.getElementById('{!$Component.my_page:c_txt}');
alert(targetDateField);