Question

I want all my dynamic generated php links to be displayed like in example 1 below and when I click on a link which takes
me to another page all its sub links are displayed like in example 2 and when I click on one of those links all its sub
links are displayed like in the rest of the examples.

I’m using PHP, MySQL and Jquery for my web site if that helps.

Example 1

<ul>
   <li><a href="link.php">First Nested List</a></li>
   <li><a href="link.php">First Nested List</a></li>
   <li><a href="link.php">First Nested List</a>
   <li><a href="link.php">First Nested List</a></li>
   <li><a href="link.php">First Nested List</a></li>
</ul>

Example 2

<ul>
   <li><a href="link.php">First Nested List</a></li>
   <li><a href="link.php">First Nested List</a></li>
   <li><a href="link.php">First Nested List</a>
      <ul>
        <li><a href="link.php">Second Nested List</a></li>
        <li><a href="link.php">Second Nested List</a></li>
        <li><a href="link.php">Second Nested List</a>
      </ul>
    </li>
   <li><a href="link.php">First Nested List</a></li>
   <li><a href="link.php">First Nested List</a></li>
</ul>

Example 3

<ul>
   <li><a href="link.php">First Nested List</a></li>
   <li><a href="link.php">First Nested List</a></li>
   <li><a href="link.php">First Nested List</a>
      <ul>
        <li><a href="link.php">Second Nested List</a></li>
        <li><a href="link.php">Second Nested List</a></li>
        <li><a href="link.php">Second Nested List</a>
          <ul>
            <li><a href="link.php">Third Nested List</a></li>
            <li><a href="link.php">Third Nested List</a></li>
            <li><a href="link.php">Third Nested List</a></li>
            <li><a href="link.php">Third Nested List</a></li>
            <li><a href="link.php">Third Nested List</a>
          </ul>
        </li>
        <li><a href="link.php">Second Nested List</a></li>
        <li><a href="link.php">Second Nested List</a></li>
      </ul>
    </li>
   <li><a href="link.php">First Nested List</a></li>
   <li><a href="link.php">First Nested List</a></li>
</ul>

Example 4

<ul>
   <li><a href="link.php">First Nested List</a></li>
   <li><a href="link.php">First Nested List</a></li>
   <li><a href="link.php">First Nested List</a>
      <ul>
        <li><a href="link.php">Second Nested List</a></li>
        <li><a href="link.php">Second Nested List</a></li>
        <li><a href="link.php">Second Nested List</a>
          <ul>
            <li><a href="link.php">Third Nested List</a></li>
            <li><a href="link.php">Third Nested List</a></li>
            <li><a href="link.php">Third Nested List</a>
              <ul>
                <li><a href="link.php">Fourth Nested List</a></li>
                <li><a href="link.php">Fourth Nested List</a></li>
                <li><a href="link.php">Fourth Nested List</a></li>
              </ul>
            </li>
            <li><a href="link.php">Third Nested List</a></li>
            <li><a href="link.php">Third Nested List</a></li>
          </ul>
        </li>
        <li><a href="link.php">Second Nested List</a></li>
        <li><a href="link.php">Second Nested List</a></li>
      </ul>
    </li>
   <li><a href="link.php">First Nested List</a></li>
   <li><a href="link.php">First Nested List</a></li>
</ul>

Answer 1

I want all my dynamic generated php links to be displayed like in
example 1 below and when I click on a
link which takes me to another page
all its sub links are displayed like
in example 2 and when I click on one
of those links all its sub links are
displayed like in the rest of the
examples.

The bold part is not so clear.

all my dynamic generated php links

how is it dynamic generated? via ajax? please explain further.

takes me to another page all its sub links are displayed

If clicking a link takes you to another page, then displaying a sublink should be done on server-side. Yes you can do it client-side via jQuery but I think it would be not practical.

Summary.

Use your php to display your sublinks.

HTML

<ul>
   <li><a href="link.php">First Nested List</a></li>
   <li><a href="link.php">First Nested List</a></li>
   <li><a href="link.php">First Nested List</a>
      <ul>
        <li><a href="link.php">Second Nested List</a></li>
        <li><a href="link.php">Second Nested List</a></li>
        <li><a href="link.php">Second Nested List</a>
          <ul class="active"> <!-- active UL -->
            <li><a href="link.php">Third Nested List</a></li>
            <li><a href="link.php">Third Nested List</a></li>
            <li><a href="link.php">Third Nested List</a>
              <ul>
                <li><a href="link.php">Fourth Nested List</a></li>
                <li><a href="link.php">Fourth Nested List</a></li>
                <li><a href="link.php">Fourth Nested List</a></li>
              </ul>
            </li>
            <li><a href="link.php">Third Nested List</a></li>
            <li><a href="link.php">Third Nested List</a></li>
          </ul>
        </li>
        <li><a href="link.php">Second Nested List</a></li>
        <li><a href="link.php">Second Nested List</a></li>
      </ul>
    </li>
   <li><a href="link.php">First Nested List</a></li>
   <li><a href="link.php">First Nested List</a></li>
</ul>

CSS

ul.active ul {
    display: none;
}

with that above, use your php skills to add/remove class active to a ul. By doing that so, and with the definition of your CSS, any ul inside active ul is not visible. In above, Fourth Nested List will not be shown on page.

---

update

ul ul {
    display: none;
}
ul.active {
    display: block; /* or display:inline; */
}

example

<ul>
   <li><a href="link.php">First Nested List</a></li>
   <li><a href="link.php">First Nested List</a></li>
   <li><a href="link.php">First Nested List</a>
      <ul>  <!-- this will be hidden and all it's sub ul -->
        <li><a href="link.php">Second Nested List</a></li>
        <li><a href="link.php">Second Nested List</a></li>
        <li><a href="link.php">Second Nested List</a>
          <ul>
            <li><a href="link.php">Third Nested List</a></li>
            <li><a href="link.php">Third Nested List</a></li>
            <li><a href="link.php">Third Nested List</a>
              <ul>
                <li><a href="link.php">Fourth Nested List</a></li>
                <li><a href="link.php">Fourth Nested List</a></li>
                <li><a href="link.php">Fourth Nested List</a></li>
              </ul>
            </li>
            <li><a href="link.php">Third Nested List</a></li>
            <li><a href="link.php">Third Nested List</a></li>
          </ul>
        </li>
        <li><a href="link.php">Second Nested List</a></li>
        <li><a href="link.php">Second Nested List</a></li>
      </ul>
      <ul class="active"> <!-- active UL, this will be displayed on the browser -->
        <li><a href="link.php">Second Nested List</a></li>
        <li><a href="link.php">Second Nested List</a></li>
        <li><a href="link.php">Second Nested List</a>
          <ul class="active"> <!-- this will be shown if it's closest parent ul is active also -->
            <li><a href="link.php">Third Nested List</a></li>
            <li><a href="link.php">Third Nested List</a></li>
            <li><a href="link.php">Third Nested List</a>
              <ul>  <!-- this will be hidden and all it's sub ul -->
                <li><a href="link.php">Fourth Nested List</a></li>
                <li><a href="link.php">Fourth Nested List</a></li>
                <li><a href="link.php">Fourth Nested List</a></li>
              </ul>
            </li>
            <li><a href="link.php">Third Nested List</a></li>
            <li><a href="link.php">Third Nested List</a></li>
          </ul>
        </li>
        <li><a href="link.php">Second Nested List</a></li>
        <li><a href="link.php">Second Nested List</a></li>
      </ul>
    </li>
   <li><a href="link.php">First Nested List</a></li>
   <li><a href="link.php">First Nested List</a></li>
</ul>