Change image src from multiple image list using jquery

I want to change image src on main image mouse hover i have one script but it work only when two images but i need to change image src from multiple images.

My existing code is like

<img width="220" height="220" alt="DE709 Folding Sunglasses" src="/images/7804/1__63824.1339534463.220.220.jpg" onmouseover="this.src='/images/x/319/1__53737.JPG'" onmouseout="this.src='/images/7804/1__63824.1339534463.220.220.jpg'">

And above code is working fine for me but i want something like this

    <ul class="ProductList List">
        <li class="Odd" style="height: 220px;">
             <div data-product="1233" class="ProductImage QuickView" style="height: 244px; width: 220px;"> 
          <a href="#">
             <img alt="DE709 Folding Sunglasses" src="/images/7804/1__63824.1339534463.220.220.jpg">
             <img style="display: none;" width="220" height="220" src="/product_images/x/319/1__53737.JPG">
              <img style="display: none;" width="220" height="220" src="/product_images/w/307/1__63824.jpg">
              <img style="display: none;" width="220" height="220" src="/product_images/l/017/DE-DISPLAY-BOX__82034.jpg">
          </a>
         <div>
       </li>
       <li>
            <div data-product="1234" class="ProductImage QuickView" style="height: 244px; width: 220px;">
            <a href="#">
            <img alt="Designer Eyewear™ Folding Sunglasses DE706" src="/images/10064/DE706__95146.1346109648.220.220.jpg" />
            <img width="220" height="220" src="/product_images/u/773/2__48597.JPG" style="display: none;">
             <img width="220" height="220" src="product_images/w/403/1__41999.JPG" style="display: none;">
             <img width="220" height="220" src="product_images/r/222/DE-DISPLAY-BOX__17353.jpg" style="display: none;"></a>
          </div>
      </li>


    </ul>

when i hover on image.jpg first time it will show me image1.jpg when mouse out it shows image.jpg and when second time it display me image2.jpg and so on when i hover 6 time it shows me image1.jpg again.

before edit i have only one div and all the solution are work for me but i need some changes on it. If I have more than one than what i do for it.

I search on Google from long time but not getting proper idea so please suggest me how can i achieve my goal.

any good link or suggetion help me great.