javascript - jQuery toggling display css attribute -

i'm trying 1 of links dynamically show when anchor href link gets clicked on.

the javascript code show cats link it's not showing cats link follows:

$(".button").click(function() {    $("#cat").show();  });

ul > li > #cat {    display: none;  }

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>    <ul>    <li><a href="index.html">dogs</a></li>    <li><a id="cat" href="javascript:void(0);">cats</a></li>  </ul>    <p>cool cats stored here</p>  <a href="javascript:void(0);" class="button">press here enable cats</a>

you'll need display:hidden default css #cat, $("#cat").show() have effect. if want button toggle show state use $("#cat").toggle()