How to toggle a hidden ul by clicking a link with jquery
<p>I have following code created dynamically with php.</p>

<p>What I want to do is when I click class='toggle' with href of desc76, I want to show ul with id desc76.</p>

<p>also I want to change arrowdown16.png to arrowup16.png.</p>

<p>Then when I click it, ul will fadeOut or hidden again.</p>

<p>class, secondul has CSS display:hidden;.</p>

<p>I tried this, but it does not work.</p>

<pre><code> $(".toggle").click(function () {
    event.preventDefault();
    var id = "#"+$(this).attr('href')
     $("id").show("slow");
    });
</code></pre>

<p>Thanks in advance for you help.</p>

<pre><code>&lt;ul&gt;
...
...
&lt;li class='toggledetail'&gt;
Show Details
&lt;div&gt;
&lt;a href='desc76' class='toggle' &gt;
&lt;img src="http://blablabla.com/assets/icons/arrowdown16.png"  alt="arrowdown16"  title="Show Details" /&gt;&lt;/a&gt;
&lt;/div&gt;
&lt;/li&gt;
&lt;/ul&gt;

&lt;ul class='secondul' id='desc76'&gt;
&lt;li class='listdetail'&gt;Spec Details&lt;div&gt;0&lt;/div&gt;
&lt;/li&gt;
&lt;/ul&gt;
&lt;li class='toggledetail'&gt;
Show Details&lt;div&gt;
&lt;a href='desc75' class='toggle' &gt;
&lt;img src="blablabla.com/assets/icons/arrowdown16.png"  alt="arrowdown16"  title="Show Details" /&gt;&lt;/a&gt;
&lt;/div&gt;
&lt;/li&gt;
&lt;/ul&gt;
&lt;ul class='secondul' id='desc75'&gt;
&lt;li class='listdetail'&gt;Spec Details&lt;div&gt;0&lt;/div&gt;
&lt;/li&gt;
&lt;/ul&gt;

... Here comes more ul
...
</code></pre>
