I want to call my JavaScript function based on the dropdown value selected. This is what I have, but when I click on age or the other value, nothing changes. Am i missing something?

  <div class="container d-flex justify-content-center">
        
            <div class="dropdown">
              <button class="btn btn-secondary dropdown-toggle mr-2" type="button" id="data" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                Search Data
              </button>
              <div class="dropdown-menu" aria-labelledby="dropdownMenuButton">
                <a class="dropdown-item" href="#">Age</a>
                <a class="dropdown-item" href="#">Gender</a>
              </div>
            </div>
    ```

JS:

    const data = document.getElementById("data").value;
    
    data.addEventListener("change", (event) =>
      usersFetch(`http://pip-data:8000/v1/content/${event.target.value}`)
    );