Script

(function($){
    $.fn.imgSelect = function(){
        $(this).each(function(){
            $(this).children('ul').eq(1).children().addClass('off').hide();
            $(this).children('ul').first().addClass('on');
            $(this).children('input').hide();
            
            $(this).children().children('li').click(function(){
                var num = $(this).index();
                $(this).hide().attr('class','off').parent().siblings('ul').children().eq(num).show().attr('class','on');
                $(this).parent().siblings('input').eq(num).attr('checked',function(){
                    if(this.checked){
                        return '';
                    } else {
                        return 'checked';
                    };
                });
            });
        });
    };
})(jQuery);

jQuery(function($){
    $('.imgSelect').imgSelect();
});

HTML

<div class="imgSelect">
<h3>未選択</h3>
<ul>
<li><img src="images/A1.png" width="108" height="43" alt="選択A" /></li>
<li><img src="images/B1.png" width="108" height="43" alt="選択B" /></li>
<li><img src="images/C1.png" width="108" height="43" alt="選択C" /></li>
<li><img src="images/D1.png" width="108" height="43" alt="選択D" /></li>
<li><img src="images/E1.png" width="108" height="43" alt="選択E" /></li>
</ul>

<h3>選択中</h3>
<ul class="delete">
<li><img src="images/A2.png" width="108" height="43" alt="選択A" /></li>
<li><img src="images/B2.png" width="108" height="43" alt="選択B" /></li>
<li><img src="images/C2.png" width="108" height="43" alt="選択C" /></li>
<li><img src="images/D2.png" width="108" height="43" alt="選択D" /></li>
<li><img src="images/E2.png" width="108" height="43" alt="選択E" /></li>
</ul>

<input type="checkbox" name="test" value="選択A" />
<input type="checkbox" name="test" value="選択B" />
<input type="checkbox" name="test" value="選択C" />
<input type="checkbox" name="test" value="選択D" />
<input type="checkbox" name="test" value="選択E" />
</div>

<div class="imgSelect">
<h3>未選択</h3>
<ul>
<li><img src="images/A1.png" width="108" height="43" alt="選択A" /></li>
<li><img src="images/B1.png" width="108" height="43" alt="選択B" /></li>
<li><img src="images/C1.png" width="108" height="43" alt="選択C" /></li>
<li><img src="images/D1.png" width="108" height="43" alt="選択D" /></li>
<li><img src="images/E1.png" width="108" height="43" alt="選択E" /></li>
</ul>

<h3>選択中</h3>
<ul class="delete">
<li><img src="images/A2.png" width="108" height="43" alt="選択A" /></li>
<li><img src="images/B2.png" width="108" height="43" alt="選択B" /></li>
<li><img src="images/C2.png" width="108" height="43" alt="選択C" /></li>
<li><img src="images/D2.png" width="108" height="43" alt="選択D" /></li>
<li><img src="images/E2.png" width="108" height="43" alt="選択E" /></li>
</ul>

<input type="checkbox" name="test2" value="選択A" />
<input type="checkbox" name="test2" value="選択B" />
<input type="checkbox" name="test2" value="選択C" />
<input type="checkbox" name="test2" value="選択D" />
<input type="checkbox" name="test2" value="選択E" />
</div>

Demo