tell me the best way to get an element of an a tag within a class?

Question

Your HTML is pretty messy. I tried to clean it up in the example below, and added some distinct text for each bit of text you’re trying to extract so it’s more illustrative that we’re grabbing 3 different links’ texts. The code iterates over the anchors found, and uses the same highly specific selector @Jaromanda X wrote in his comment.

Click the “Run” button below to see it in action.

let anchors = document.querySelectorAll('ul.main_Bucket>li.id_category>span.id_device>a');
console.log(anchors.length, "anchors found");
anchors.forEach((anchor)=>console.log(anchor.innerText));

<ul class ="main_Bucket">
  <li class="id_category">
    <span class="id_item"></span>
    <span class="id_device">
      <a href="somesite.com">ONE: This is the Data I want to Grab</a>
    </span>
  </li>
</ul>
<ul class ="main_Bucket">
  <li class="id_category">
    <span class="id_item"></span>
    <span class="id_device">
      <a href="somesite.com">TWO: This is the Data I want to Grab</a>
    </span>
  </li>
</ul>
<ul class ="main_Bucket">
  <li class="id_category">
    <span class="id_item"></span>
    <span class="id_device">
      <a href="somesite.com">THREE: This is the Data I want to Grab</a>
    </span>
  </li>
</ul>

Leave a Comment Cancel Reply