How to show a specific message in an alert depending on the data-id attribute of a button in javascript?

Question

I want to show a specific message when a user clicks on a download button but the value depends of the data-id.

This is what i have so far:

<div>
<ul>
<li className="col rats"><a title="Rats" href="#rats" data-id="rats" id="ratsDownload">
<li className="col frogss"><a title="Frogs" href="#frogs" data-id="frogs" id="frogsDownload">
</div>
<button type="button" onclick="show()">Download!</button>

<script>
 function show(){
var idOne = document.getElementById('ratsDownload');
var idTwo = document.getElementById('frogsDownload');

 var Val = rats.getAttribute('data-id');
 var Val2 = frogs.getAttribute('data-id');
   
  if(Val==rats){
    alert("5");
}

 if(Val2==frogs){
    alert("9");
}
}

</script>

Answer 1

<div>
<ul>
<li className="col rats"><a title="Rats" href="#rats" data-id="rats" id="ratsDownload">
<li className="col frogss"><a title="Frogs" href="#frogs" data-id="frogs" id="frogsDownload">
</div>
<button type="button" onclick="show()">Download!</button>

<script>
 function show(){

var idOne = document.getElementById('ratsDownload');
var idTwo = document.getElementById('frogsDownload');

 var Val = idOne.getAttribute('data-id');
 var Val2 = idTwo.getAttribute('data-id');
   
  if(Val==="rats"){
    alert("5");
}

 if(Val2==="frogs"){
    alert("9");
}
}

</script>