JQuery.load result in div 'call' (not id specified)?

Question

I am collecting a fairly simple function of "voting" - the user clicks on the link, the "action" page adds voting to the database and returns the number of votes. This is what I have now;

<a onClick="vote(#tipID#);return-false;" class="post-add-icon inline-items" id="tipVote"><i class="far fa-heart"></i> #tipVotes#</a>

and JS;

<script>
function vote(num){$("#tipVote").load('/assets/a/vote/?vtype=tip&tipID='+num+'');}
</script>

Everything works fine, with one exception - I have several div named tipVote on the page (dynamic output). Although I can change the div names by adding id (for example tipVote999, tipVote232, etc.), I don’t know what will be with this ID before the release, and of course it would be incredibly dirty to duplicate the code for each identifier.

So my question is whether one of them is possible:

• Is there any way to limit the sending of a message to a tag that calls it? I tried (without success);

  function vote (num) {
     $('this').load('/assets/a/vote/?vtype=tip&tipID=' + num + '');
  }
  

• , - onclick, div post back. ( );

    function vote(num){
       $("#tipVote' + num+'").load('/assets/a/vote/?vtype=tip&tipID='+num+'');
    }

, - , -, .

!

Answer 1

, ; :

function vote(num){
   $("#tipVote" + num).load('/assets/a/vote/?vtype=tip&tipID='+num);
}

, div id - "tipVote123", vote(123), vote('123') div.

DOM , DOM, , div, , tipID, , DOM.

Answer 2

- : (, "# tipID #" - )

<div id="div_"+#tipID#>
<a href='#' class="tipVote post-add-icon inline-items" id= #tipID# ><i class="far fa-heart"></i> #tipVotes#</a>
</div>

jQuery

<script>
  $(document).ready(function(){
    $('.tipVote').click(function () {
      var id = $(this).id();

      var jqxhr = $.post( "/assets/a/vote/?vtype=tip&tipID='+id+''", function() {
        //alert( "success" );
        $('#div_'+id).html('<p>Voted</p>');
      })
      .fail(function() {
        alert( "error" );
      });
    });
  });
</script>