Jquery onmouseover() function on dynamic html images and span
I have some images and some span text on my page. Each image has his text and those elements are added dynamicaly with javascript.

Now, I would like to show the right message when mouseover on an image is detected.

It is not easy to explain, so here is the example:


     for(var affiliation_id=0; affiliation_id<article_affiliations.length; affiliation_id++)
	{
       $('#country_warning'+affiliation_id).mouseover(function() {
			  document.getElementById('country_warning_message'+affiliation_id).style.visibility='visible';
		  }).mouseout(function(){
			  document.getElementById('country_warning_message'+affiliation_id).style.visibility='hidden';
		  });	
    }

The problem is that when the onmouseover function will be called, the affiliation_id will have the maximum value and the message will be shown near the last image, and not near the clicked one.

Thank you very much for your help.
Jquery onmouseover() function on dynamic html images and span
===

I have some images and some span text on my page. Each image has his text and those elements are added dynamicaly with javascript.

Now, I would like to show the right message when mouseover on an image is detected.

It is not easy to explain, so here is the example:


     for(var affiliation_id=0; affiliation_id<article_affiliations.length; affiliation_id++)
	{
       $('#country_warning'+affiliation_id).mouseover(function() {
			  document.getElementById('country_warning_message'+affiliation_id).style.visibility='visible';
		  }).mouseout(function(){
			  document.getElementById('country_warning_message'+affiliation_id).style.visibility='hidden';
		  });	
    }

The problem is that when the onmouseover function will be called, the affiliation_id will have the maximum value and the message will be shown near the last image, and not near the clicked one.

Thank you very much for your help.