событие click на bootom jquery

Всем доброго времени суток. решил я зделать голосовалку с выводом модального окна с результатом
решил использовать jquery но затык на событии. ув гуру подскажите что не так.
имею форму

Код (Text):

1.  
2. <form id='ajax-voite-form' action="script.php">
3.     <button type="buttom" name='submit' class="btn btn-default btn-lg" >
4.     <span class="glyphicon glyphicon-thumbs-up"></span><em>Нравится</em></button>
5. </form>

и сам jquery

Код (Text):

1.  
2. <script type='text/javascript'>
3.    
4.         $('#ajax-voite-form').bind('click', function(){
5.           alert('Вы нажали на элемент ');
6.         });
7. </script>

 

нет. alert не отрабатывает

Добавлено спустя 3 минуты 48 секунд:
<script type='text/javascript'>
alert('Вы нажали на элемент ');
$('#ajax-voite-form').bind('click', function(){
alert('Вы нажали на элемент ');
});
</script>
вынес alert отрабатыват
поставил заглушку в action и скрипт отработал .
теперь нужно зделать так чтобы вместо перехода по сылке action ана обрабатывалась в jquery и после было вызванно модальное окно с результаом исполнения.

 

спасибо за одыкватный ответ.
можно пример буду очень признателен.

 

спасибо

 

Нашел код в котором говорится о том что браузер не будит переходить при клике
но переход происходит . что не правильно в коде?
jquery

Код (Text):

1.  
2. $(document).ready(function(){
3.     $('a').bind('click',clickHandler);
4. });
5. function clickHandler(eventObject)
6.     {
7.         eventObject.preventDefault();
8.         alert($(eventObject.target).attr('href'));
9.        
10.         return false;
11.     }

html

Код (Text):

1.  
2. <a href="http://google.com" id="tt">ссылка</a><br />

 

undefined выводится в модальном окне
я не силен в js но могу сказать что библиотека подключенна.
отрабатывало у меня по всей видимости потому что я не правильно пытаюсь обратится к элементу с id
было

Код (Text):

1.  
2. $(document).ready(function(){
3.    $('a #tt').bind('click',clickHandler);
4. });
5. function clickHandler(eventObject)
6.    {
7.       eventObject.preventDefault();
8.       alert($(eventObject.target).attr('href'));
9.      
10.       return false;
11.    }

зделал

Код (Text):

1.  
2. $(document).ready(function(){
3.    $('#tt').bind('click',clickHandler);
4. });
5. function clickHandler(eventObject)
6.    {
7.       eventObject.preventDefault();
8.       alert($(eventObject.target).attr('href'));
9.      
10.       return false;
11.    }

алерт выводится , но вместо сылки выходит undefined
код html

Код (Text):

1.  
2. <a href="http://test.loc/contr/fun/3" id="tt">
3.     <button name='submit' class="btn btn-default btn-lg" >
4.     <span class="glyphicon glyphicon-thumbs-up"></span><em>Нравится</em></button>
5. </a>

убрал вложеность

Код (Text):

1.  
2. <a href="http://test.loc/contr/fun/3" id="tt">
3.    
4.     Нравится
5. </a>

все отработало как нужно.
проблема решена:

Код (Text):

1.  
2.  
3.     <button name='submit' class="btn btn-default btn-lg" >
4.     <span class="glyphicon glyphicon-thumbs-up">
5.        </span>
6.         <em>
7.         <a href="http://test.loc/contr/fun/3" id="tt">Нравится</a>
8.        </em>
9. </button>

всем благодарен

 

тогда вместо

Код (Text):

1. attr('href')  использовать  attr('value')

как бы вы зделали ?

 

решил таким способом

Код (Text):

1.  
2. $(document).ready(function(){
3.          $('.voite').bind('click',clickheandler);
4. });
5. function clickheandler(eO)
6.             {
7.             eO.preventDefault();
8.                 alert($(eO.target).attr('value'));
9.                 return false;
10.                
11.             }

html

Код (Text):

1.  
2. <button name='submit'
3.     class="btn btn-default btn-lg"   >
4.     <span class="glyphicon glyphicon-thumbs-up"></span><em
5.      value="<?=base_url();?>users/voice/<?=$data['id_site'];?>" class="voite">Нравится</a>
6.     </em>
7.     </button>

теперь вместо вывода алерт нужно отправить ajax запрос получить оответ вывести в модальное окне