How can I show a hidden list item on page load?

Question

I want to display my parent ul on pageload. But my code is not working:

$(document).ready(function(){
  ('ul:first').show();
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<ul style="display:none">
  <li>I am visible</li>
  <ul style="display:none">
    <li>I am not visible</li>
    </ul>
</ul>

Answer 1

You are missing $ while selecting element

$(document).ready(function() {
  $('ul:first').show();
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<ul style="display:none">
  <li>I am visible</li>
  <ul style="display:none">
    <li>I am not visible</li>
  </ul>
</ul>