Jquery on(click) Each time you click, the information is taken from the first element

Question

Each time you click, the data is taken from the first element

for example, i have couple links with parameters

$(document).on('click', '.sitesubpay', function() {
  var siteid = $('.sitesubpay').data('siteid');
  var domaani = $('.sitesubpay').data('domain');
  $('.getmymodal').click();
  $("#domain").val(domaani);
  $("#myModalLabel").text(' for ' + domaani);
  console.log(siteid);
  console.log(domaani);
  var siteid = '';
  var domaani = '';
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<a class="sitesubpay" data-siteid="2121" data-domain="domain1.com"><span class="label label-warning">pending payment </span></a>
<a class="sitesubpay" data-siteid="2122" data-domain="domain2.com"><span class="label label-warning">pending payment </span></a>
<a class="sitesubpay" data-siteid="2123" data-domain="domain3.com"><span class="label label-warning">pending payment </span></a>

but each click on any element, returns the data of only the first in the console.log

2121
domain1.com

Inside the function, use `$(this)` instead. `$('.sitesubpay')` will select all three of them again, and either use the first or give unexpected results. — , Mar 16 '21 at 14:39
[Duplicate](https://google.com/search?q=site%3Astackoverflow.com+jquery+get+clicked+element) of [Get clicked element using jQuery on event?](https://stackoverflow.com/q/16091823/4642212). — Sebastian Simon, Mar 16 '21 at 14:39

score 1 · Accepted Answer · edited Mar 16 '21 at 14:41

Try to write this

$(document).on('click', '.sitesubpay', function() {
  var siteid = $(this).data('siteid');
  var domaani = $(this).data('domain');
  $('.getmymodal').click();
  $("#domain").val(domaani);
  $("#myModalLabel").text(' for ' + domaani);
  console.log(siteid);
  console.log(domaani);
  var siteid = '';
  var domaani = '';
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<a class="sitesubpay" data-siteid="2121" data-domain="domain1.com"><span class="label label-warning">pending payment </span></a>
<a class="sitesubpay" data-siteid="2122" data-domain="domain2.com"><span class="label label-warning">pending payment </span></a>
<a class="sitesubpay" data-siteid="2123" data-domain="domain3.com"><span class="label label-warning">pending payment </span></a>

Jquery on(click) Each time you click, the information is taken from the first element

1 Answers1