0

I am trying to make the following query work:

let itemName = "Fancy-item-name"
document.querySelector(`a[href*=${itemName}] + div.ugly-class-wrapper > div.second-ugly-class > div.first-button`);

i tried as well, nextSibling option, but returning undefined for the query.

What am I doing wrong?

the html is following:

<div> 
  <a class="some-ugly-class" aria-label="Fancy-item-name" href="/item/fancy-item-name">Fancy item</a>

  <div class="ugly-class-wrapper">
    <div class="first-ugly-class"></div>
    <div class="second-ugly-class">
      <button type="button" class="first-button"></button>
      <button type="button" class="second-button"></button>
    </div>
  </div>
</div>

i am trying to click the second button <button type="button" class="second-button"></button>, by using a href above, which is always dynamic.

qwerty
  • 51
  • 7
  • 1
    Your selector is wrong - `div.first-button` will select a div, not a button (but what you want is a button) – CertainPerformance Jun 11 '22 at 16:14
  • If you want to click a button why (and how for that matter) are you usina a link to do so? If you want to click a button programmatically `document.querySelector(".second-button").click();` – zer00ne Jun 11 '22 at 16:19
  • I am automating some steps on specific website, so can't really just select button programmatically. Need to follow it through the outer ref, but ```document.querySelector(`a[href*=${itemName}] + div.ugly-class-wrapper > div.second-ugly-class > button.second-button`);``` does the job, thanks to CaptainPerformance – qwerty Jun 11 '22 at 16:20

0 Answers0