Récupérer la valeur de data-namereport dynamiquement

salut, je voudrais récupérer la valeur de "data-id" lorsqu'on clic sur le lien. j'arrive a le faire, le problème est qu'il me renvoie chaque fois la valeur "data-id" du premier lien. comment récupérer la valeur de la "data-id" du lien courant. merci.

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
<ul class="dropdown-menu dropdown-light-blue dropdown-caret">
  <li>
    <a id="route" onclick="datalistSideBarSwitch('report');getTypeReport(this);" href="#" class="report" data-namereport="routes">
      <span class="fa fa-road" style="color:#6c6b6b;"></span>
      <span>
        <? echo $la['ROUTES']; ?></span>
    </a>
  </li>
  <li>
    <a id="route_stops" onclick="datalistSideBarSwitch('report');getTypeReport(this);" href="#" class="report" data-namereport="routes_stops">
      <span class="fa fa-road" style="color:#6c6b6b;"></span>
      <span>
        <? echo $la['ROUTES_WITH_STOPS']; ?></span>
    </a>
  </li>
  <li>
    <a id="drive_stops" onclick="datalistSideBarSwitch('report');getTypeReport(this);" href="#" class="report" data-namereport="drives_stops">
      <span class="fa fa-road" style="color:#6c6b6b;"></span>
      <span>
        <? echo $la['DRIVES_AND_STOPS']; ?></span>
    </a>
  </li>
</ul>

Code:

1
2
3
4
5
6
function getTypeReport(){
    var id_report = $(".dropdown-menu li .report").attr("id");
    var data_id =  $("#"+id_report).data("namereport");
    console.log("value id .....report   : " + id_report);
    console.log("value data_id .....report   : " + data_id);
}

ce code me renvoi que la valeur du premier "data-namereport" contenu dans le premier "li" mais lorsque je clique sur le deuxième lien. je voudrais récupérer le "data-namereport" du lien courant.(c'est a dire celui sur lequel l'utilisateur a cliquer)