I want to Slide Down tabe row smoothly and Slowly.

The problem now is, it is instantly appearing and hiding, how can i make it smooth.

```
**Please check this fiddle:**

```

<http://jsfiddle.net/5WT9g/2/>

HTML:

```
<a href="javascript:void(0)" id="showContent">Show Content</a>
<br><br><br>
<table width="400" border="1">
    <tr id="mainContent" style="display:none;">
        <td> THIS IS MAIN CONTENT </td>
    </tr>
</table>

```

JS:

```
 $('#showContent').click(function ()
                         {

   $('#mainContent').slideToggle('slow');                      

                         });

```