update the same div with dynamic ajax

Question

I have div1 with Jquery on click to update content dynamically with $ajax.

Later, the query change and I need to update the content again whenever the user click on div1

Both queries are working fine, however, the problem is on.click which updates the second query will load the first query result to the div not the 2nd updated query result.

The example below explains something, not code correction though:

<div id='1'></div>

Query 1: $('1').click ($ajax('condition1+condition2')) -> output: string 1

Result:

<div id='1'>string 1</div>

Query 2: $('1').click ($ajax('condition3+condition4')) -> output: string 2

Result is still:

<div id='1'>string 1</div>

Is it becuase the same div id will fire the first happened condition? How can I design this to update the on.click content dynamically with new conditions?

Answer 1

I hope understand your question.....I'm guessing your first ajax call runs when the document is ready? Then the second ajax call runs when the user clicks on the div? but your problem is that your first ajax call is being called when the user clicks right? If so this will solve it:

I think the simple thing would be to create a variable "firstAjaxRan", set it to false. When the first ajax call runs check if "firstAjaxRan" is true, if not then run it then set it to true. This will prevent the first ajax call from running again when the user clicks on the div. Your 2nd ajax should run fine.