How to catch this nth-child() with css

Question

I have this html code

<ul>
<div id="consolidation-checkboxes-container" class="consolidation-checkboxes container" style="height: 104px;">                     
    <a href="" class="consolidation-link" target="_blank">
    <li>one</li>
    </a>
    <a href="" class="consolidation-link" target="_blank">
    <li>two</li>
    </a>
    <a href="" class="consolidation-link bordered" target="_blank">
    <li>three</li>
    </a>
    <a href="" class="consolidation-link" target="_blank">
    <li>four</li>
    </a>
    <a href="" class="consolidation-link" target="_blank">
    <li>five</li></a>
    <a href="" class="consolidation-link" target="_blank">
    <li>six</li>
    </a>
    <a href="" class="consolidation-link" target="_blank">
        <li>seven</li>
    </a>
    <a href="" class="consolidation-link" target="_blank">
        <li>eight</li>
    </a>

</div>
</ul>

I would like the seventh li not have bullet.Is this possible to be done with css, because I am not allowed to change the html

Answer 1

If your html is the one you provide you can use the following code:

ul div a:nth-child(7) li {
  list-style-type: none;
}

<ul>
  <div id="consolidation-checkboxes-container" class="consolidation-checkboxes container" style="height: 104px;">
    <a href="" class="consolidation-link" target="_blank">
      <li>one</li>
    </a>
    <a href="" class="consolidation-link" target="_blank">
      <li>two</li>
    </a>
    <a href="" class="consolidation-link bordered" target="_blank">
      <li>three</li>
    </a>
    <a href="" class="consolidation-link" target="_blank">
      <li>four</li>
    </a>
    <a href="" class="consolidation-link" target="_blank">
      <li>five</li>
    </a>
    <a href="" class="consolidation-link" target="_blank">
      <li>six</li>
    </a>
    <a href="" class="consolidation-link" target="_blank">
      <li>seven</li>
    </a>
    <a href="" class="consolidation-link" target="_blank">
      <li>eight</li>
    </a>

  </div>
</ul>

Additional as mention in comments ul element can only contain zero or more li elements, eventually mixed with ol and ul elements. So you can change your html mark up to be valid like:

ul li:nth-child(7) {
  list-style-type: none;
}

<ul>
  <li><a href="#" class="consolidation-link" target="_blank">one</a>
  </li>
  <li><a href="#" class="consolidation-link" target="_blank">two</a>
  </li>
  <li><a href="#" class="consolidation-link bordered" target="_blank">three</a>
  </li>
  <li><a href="#" class="consolidation-link" target="_blank">four</a>
  </li>
  <li><a href="#" class="consolidation-link" target="_blank">five</a>
  </li>
  <li><a href="#" class="consolidation-link" target="_blank">six</a>
  </li>
  <li><a href="#" class="consolidation-link" target="_blank">seven</a>
  </li>
  <li><a href="#" class="consolidation-link" target="_blank">eight</a>
  </li>
</ul>