Select the last a:link from a nested dynamic navigation list

Ask a question
0

I’m trying to remove the content of an :after pseudo element of an a:link from a bunch of nested un-ordered lists. I can’t seem to select it though.

How can I select the last a:link for this dynamically created navigation list? Thanks.

HTML

<nav class="site-nav children-links">

  <span class="parent-link">
    <a href="http://localhost/learnwebcode/index.php/sample-grandparent/">
      Sample grandparent
    </a>
  </span>

  <ul>
    <li class="page_item page-item-2 page_item_has_children current_page_item"><a href="http://localhost/learnwebcode/index.php/sample-grandparent/sample-page/" aria-current="page">Sample Parent Page</a>
    <ul class="children">
      <li class="page_item page-item-16">
        <a href="http://localhost/learnwebcode/index.php/sample-grandparent/sample-page/sample-child-one/">Sample child one</a>
      </li>
      <li class="page_item page-item-18">
        <a href="http://localhost/learnwebcode/index.php/sample-grandparent/sample-page/sample-child-two/">Sample child two</a>
      </li>
    </ul>
    </li>
  </ul>

</nav>

CSS

.children-links a:after {
  content: "➤";
}

.children-links ul:last-child li a:last-child:after {
  content: "";
}
Coin iconoffer bounty
add comment

0 Answer

Your Answer