Update jQuery variable in ajax complete

Question

im still new to js.

I use ajax to filter content in wordpress. So I need to send 2 variables in PHP. But the problem is that after I moved on, one of the variables must change. In html, the data changes, but the jquery that works (document) .ready uses the initial variable. How can I make a variable update on ajax complete?

here is my code

jQuery(document).ready(function($) { $('.tax-filter').click( function(event) { if (event.preventDefault) { event.preventDefault(); } else { event.returnValue = false; } var selecetd_taxonomy = $(this).attr('id'); var personData = $('#content').data('id'); data = { action: 'filter_posts', afp_nonce: afp_vars.afp_nonce, taxonomy: selecetd_taxonomy, person: personData, }; $.ajax({ type: 'post', dataType: 'json', url: afp_vars.afp_ajax_url, data: data, success: function( data, textStatus, XMLHttpRequest ) { $('.showContent').html( data.response ); }, error: function( MLHttpRequest, textStatus, errorThrown ) { $('.projects').html( 'Error 404' ); } }) }); }); 

From another function .data ('id') in html gets a new value, but I need jQuery to get a new value, and

EDIT:

I need personal information that will be updated in my click function. The #content data id value is updated on ajaxComplete. This is done by another click function that gets the value from PHP.

Answer 1

Update the data identifier using $('#content').data('id', 'newValueHere') instead of $('#content').attr('data-id', 'newValue')

See fiddle and note that changing the attribute with .attr () does not work, but .data () does.