Question

I’m trying to do a simple fadeToggle() with jQuery and for some reason the code isn’t firing. I want clicking the link in the first <li> to make the other four list items appear.

Here’s the HTML:

 <ul>
        <li><a id="filters-switch" href="javascript:void(0)">filters</a></li>
        <li class="filters"><a href="http://cargocollective.com/dzangtech/filter/event/">events</a></li>
        <li class="filters"><a href="http://cargocollective.com/dzangtech/filter/release/">releases</a></li>
        <li class="filters"><a href="http://cargocollective.com/dzangtech/filter/misc/">misc.</a></li>
        <li class="filters"><a href="http://cargocollective.com/dzangtech">all</a></li>
 </ul>

Here’s the JavaScript:

<script type="text/javascript">
  $("#filters-switch").click(function() {
  $(".filters").fadeToggle("slow", "linear");
});
</script>

Also this is the website if it helps to look at that: http://cargocollective.com/dzangtech. The links are in the top-left.

Answer 1

You are using jQuery v1.4.2, apparently it doesn’t feature fadeToggle – update to latest.

EDIT: yes, fadeToggle comes in 1.4.4.