I made this from a post i saw on this forum and i need help

how do i do so is is not a div but links or link classes that activates the anim ation and lets the content slide in when pressed

<hr>

<html>
<head>


<link rel="stylesheet" type="text/css" href="style.css" />
<script type="text/javascript" src="jquery.js"></script>

<script type="text/javascript" src="jquery.easing.1.3.js"></script>
<script type="text/javascript" src="sprite.js"></script>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
  <script src="http://code.jquery.com/jquery-latest.js"></script>
<script type="text/javascript">

var stopPosition = 420;

window.onload=function()
{
  document.getElementById("c1").onclick = slideIt;
  slidingDiv = document.getElementById("c2");
};

function slideIt()
{
  if (parseInt(slidingDiv.style.left) < stopPosition )
  {
    slidingDiv.style.left = parseInt(slidingDiv.style.left) + 50 + "px";
    setTimeout(slideIt, 1);
  }
}
</script>
</head>
<body>

  <!-- Logo Start -->
<img src="images/alex.png">
<!-- Logo slut -->

<!-- Navbar start -->
<div id="nav">
<ul id="navigation">
  <li><a id="c1"></a></li>
  <li><a class="services" href="#"></a></li>
  <li><a class="portfolio" href="#"></a></li>
  <li><a class="about" href="#"></a></li>
    <li><a class="contact" href="#"></a></li>
    <li><a class="home" href="#"></a></li>
  <li><a class="services" href="#"></a></li>
  <li><a class="portfolio" href="#"></a></li>
  <li><a class="about" href="#"></a></li>
    <li><a class="contact" href="#"></a></li>
</ul>
</div>
<br/>
<!-- Navbar slut -->

<div id="c2" style="position: absolute; left:-794px; top:250px"></div>

</body>
</html>