JQuery мышь и проблема переключения

Question

Я пытаюсь, чтобы при наведении курсора мыши появлялась ссылка, и при нажатии на нее ссылка переключала div (показать / скрыть).То, что у меня сейчас есть, ниже.

PHP:

<li class="test">    <div class="link" style="display:none">
                <span class="toggle"><a href="#">link</a></span>
                                    </div>
    <div class="togglediv"><p>lorem ipsum</p></div>
</li>

JQUERY:

    <script language="javascript">
    jQuery(document).ready(function($){
                  $('.test').bind('mouseenter mouseleave', function(e){

                      var fade_type = e.type == 'mouseenter' ? 'fadeIn' : 'fadeOut';
                      $(this).find('.link')[fade_type]();

                  }).find('.toggle a').click(function($){
$(".togglediv").hide();
      $(this).toggleClass("active").next().slideToggle("slow");
    return false;
    });
    });
    </script>

Наведите курсор мыши, но переключение не происходит.Когда я нажимаю на ссылку, ничего не происходит.Что дает?

Answer 1

демо здесь

http://jsfiddle.net/JE8Bz/

1) в качестве проблемы, упомянутой TJ Crowder

2) вы вводите $ в параметре click() function

Answer 2

Вот пример: http://jsfiddle.net/mazzzzz/MeAnJ/9/

Обновление скрипки

Answer 3

У вашей ссылки нет следующего брата (это единственная вещь в span, которая является единственной в div), поэтому вызов next для нее вернет пустой набор. Возможно, используйте closest, чтобы перейти к содержащемуся div, затем next, чтобы перейти:

$(this).toggleClass("active").closest('div').next().slideToggle("slow");