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开发者_Python百科 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>

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>

The simplest solution i would try is:

<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>
   <?php if($page = "Some nested page"): ?>
      <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>
   <?php endif; ?>
   </li>
   <li><a href="link.php">First Nested List</a></li>
   <li><a href="link.php">First Nested List</a></li>
</ul>

The way I would do it is to always add all sub-menu's (and sub-sub, etc.) to your html and set an active class on the current active main menu, sub-menu, sub-sub-menu, etc.

I would then use css to hide the sub-menu's that don´t fall under an active class.

That way you can easily have your menu's pop-up in the future when somebody hovers or clicks on a parent. If you should ever want that...