title: need help on jquery animate
body: <p>in my html code i have something like this. </p>
  
  <pre><code>&lt;ul id="selections"&gt;
                          &lt;li id="tt"&gt;
                              &lt;div style="background-color: #0099ff; width: 200px;"&gt;
                                  &lt;a style="padding: 5px;" id="aa" href="&lt;?php echo base_url() . 'new_user'; ?&gt;"&gt;New User&lt;/a&gt;
                              &lt;/div&gt;
                          &lt;/li&gt;
                          &lt;li&gt;
                              &lt;div style="background-color: #0099ff; width: 200px;"&gt;
                                  &lt;a href="&lt;?php echo base_url() . 'old_user'; ?&gt;"&gt;Existing User&lt;/a&gt;
                              &lt;/div&gt;
                          &lt;/li&gt;
                          &lt;li&gt;
                              &lt;div style="background-color: #0099ff; width: 200px;"&gt;
                                  &lt;a href="&lt;?php echo base_url() . 'management_hod'; ?&gt;"&gt;Managements / HOD&lt;/a&gt;
                              &lt;/div&gt;
                          &lt;/li&gt;
                          &lt;li&gt;
                              &lt;div style="background-color: #0099ff; width: 200px;"&gt;
                                  &lt;a href="&lt;?php echo base_url() . 'hr'; ?&gt;"&gt;HR&lt;/a&gt;
                              &lt;/div&gt;
                          &lt;/li&gt;
  &lt;/ul&gt;
  </code></pre>
  
  <p>then I'am using jquery to animate this, </p>
  
  <pre><code>&lt;script&gt;
              $(document).ready(function() {
  
                  $("#tt").mouseover(function() {
                      $("#aa").stop().animate({
                          padding: "5px 5px 5px 100px",
                      });
                  });
  
                  $("#tt").mouseout(function() {
                      $("#aa").stop().animate({
                          padding: "5px"
                      });
                  });
  
              });
          &lt;/script&gt;
  </code></pre>
  
  <p>this script now works for first <li> item without any problem. but the thing is I'don't have any idea how to apply this effect to other li items. </p>
  
  <p>any help?
  Thank you</p>