How to change ul list items from another onclick with jquery??

How to change ul list items from another onclick with jquery??

Hello, im starting to study jquery and im trying to show my second list of items when i click in "show more links", but im not having  success. Can anyone give some help?


<footer id="footer-container">
      <section id="footer1">
 
          <ul id="showfirst">
             <h1>Links</h1>
             <li><a href="#">Link 1</a></li>
             <li><a href="#">Link 2</a></li>
             <li><a href="#">Link 3</a></li>
             <li><a href="#">Link 4</a></li>
             <li><a href="# id="next">show more links </a></li>
          </ul>
 
          <ul id="showsecond">
             <li><a href="#">Link 5</a></li>
             <li><a href="#">Link 6</a></li>
             <li><a href="#">Link 7</a></li>
             <li><a href="#">Link 8</a></li>
             <li><a href="#">back</a></li>
          </ul>
 
       </section>
   </footer>




Jquey:


<script type="text/javascript">
    $('#next).click(function{
  
    $('#showsecond').show();
 
});
</script>