Changing two items with the self id

Changing two items with the self id

Hi

I'm all new to jQuery and have the following problem. I'm sure the pros here can give me a hint, how i do it the right way:

  1. <div class="images">
  2.       <img id="id-14" src="Jack" />
  3.       <img id="id-22" src="Dan" />
  4.       <img id="id-15" src="Paul" />
  5. </div>
  6. <div class="names">
  7.       <div id="id-22">Dan Pundler</div>
  8.       <div id="id-14">Jack Mc Donalds</div>
  9.       <div id="id-15">Paul Jackson</div>
  10. </div>
The images are fadedTo .5 after loading. The mouseover on the names have to fade the pics back to 1. How do i have to write the code, that i can work with the id's without doing it for each id. The id's are given by the system and the pictures and the names are not in the same order, so i can't let jQuery do the job, by a own ordering.  Please excuse my bad english, i hope you understand what i want to do.

The code should do something like, but should be available for all id's. Is there a possibility to load the id in variable or something similar?

  1. $(".names #id-22").hover(
  2.       function() {
                $("images #id-22").fadedTo1;     
          },

  3.       function() {
                $("images #id-22").fadedTo0.5;     
          }

  4. );

Thanks
Pierre