Как можно получить текст ссылки из dropdown menu bootstrap

Всем привет. У меня есть dropdown меню из bootstrap. Мне надо при нажатии на ссылку получить его текст и вставить этот текст в input .

<div class="dropdown">
  <button class="btn btn-secondary dropdown-toggle" type="button" data-bs-toggle="dropdown" aria-expanded="false">
    Dropdown button
  </button>
  <ul class="dropdown-menu">
    <li><a class="dropdown-item" href="#">Action</a></li>
    <li><a class="dropdown-item" href="#">Another action</a></li>
    <li><a class="dropdown-item" href="#">Something else here</a></li>
  </ul>
</div> 

Я пытался сделать так

   document.querySelector('.dropdown-item').addEventListener('click' , ()=>{
        console.log(document.querySelector('.dropdown-item').innerHTML)
        document.querySelector('.tariff').value = document.querySelector('.dropdown-item').innerHTML
    })

но он работает только на первую ссылку, как сделать что бы работало на все