Выделить картинки для записи значений в БД

[phpcode]

Привожу пример:
К примеру есть 4 картинки, с чекбоксами(чекбоксы можно скрыть - display:none; в css, для теста оставил)
Если нажимаешь на любую картинку то выделяются все чекбоксы под всеми картинками и самая первая картинка становиться полупрозрачной.
Как сделать чтобы выделялась конкретная картинка и конкретный чекбокс под ней и записывалась ид во временную таблицу(MYSQL)
И второй вопрос - если нажимаешь опять на картинку то нужно чтобы чекбокс отжался обратно, убралась прозрачность картинки и удалить ид с временной таблице.


html:

<td><img class='img_links' align='left' src='http://localhost/1.jpg' width='100' height='100' alt='Test1' title='Test1' id="bg"><input name='id[1]' type='checkbox' value='1'></td>

<td><img class='img_links' align='left' src='http://localhost/2.jpg' width='100' height='100' alt='Test2' title='Test2' id="bg"><input name='id[2]' type='checkbox' value='2'></td>

... ещё 2 картинки

css:

.img_links {
   border:2px solid #000000;
   margin:0px;
    position: relative;}
    
.img_links2 {
   border:2px solid #FFFFFF;
   margin:0px;
        filter:progid:DXImageTransform.Microsoft.Alpha(opacity=50); /* IE 5.5+*/
       -moz-opacity: 0.5; /* Mozilla 1.6 и ниже */
       -khtml-opacity: 0.5; /* Konqueror 3.1, Safari 1.1 */
       opacity: 0.5; /* CSS3 - Mozilla 1.7b +, Firefox 0.9 +, Safari 1.2+, Opera 9+ */
       zoom: 1; /* для элемента в ИЕ, у которого не заданы width и height */
       position: relative;}

js:

$(function() {
 $('.img_links').click(function(e){
     e.preventDefault();
   $("#bg").attr('class',"img_links2");
   $("input").attr('checked',"checked");
 });
});