Подсветка gif-картинок (фоном) при выделении чекбоксом

[zlyukensobaken]

Приветствую всех!

 

Столкнулся с проблемой, решение которой нигде не могу найти.

Задача в следующем: нужно, чтобы при выделении определенного чекбокса подсвечивались прозрачные картинки определенном цветом (т. е. должен появиться фон под нужными картинками)

 

Есть подобная верстка:

<div id="container"><div><img src="111.gif"></div><div><img src="222.gif"></div><div><img src="333.gif"></div><div><img src="111.gif"></div><div><img src="444.gif"></div><div><img src="555.gif"></div><div><img src="222.gif"></div><div><img src="111.gif"></div></div>

Под этой версткой есть 5 чекбоксов

Нужно чтобы при выборе одного чекбокса выделялись все картинки 111 (подсвечивались, допустим, красным цветом), при выборе второго чекбокса подсвечивались все картинки 222, допустим, синим цветом и т. д.

 

Логика подсказывает, что картинки должны содержать id, но на этом  мысли заканчиваются.

 

Выручите?

Заранее благодарен!

[Veseloff]

Не обязательно id, а, может, и нельзя тут id использовать. Ставите listener на чекбоксы и перебираете элементы, фильтруя по содержимому src.

[zlyukensobaken]

Спасибо, думал будет что-то попроще (что-то типа такого http://jsfiddle.net/DrJLw/),я с listener не разберусь.

[Veseloff]

Ну jQuery вам ставит листенер сам. Можете его использовать. С jQuery вообще всё просто.

[Sensei]

http://jsfiddle.net/Lrhwmfps/1/

[zlyukensobaken]

http://jsfiddle.net/Lrhwmfps/1/

Спасибо большое!

 

А не поможете еще с одним вопросом?

<div id="container">

<div class="aaa"></div>

<div class="bbb"><img src="bbb.gif"></div>

<div class="ccc"></div>

<div class="ddd"><img src="ddd.gif"></div>

</div>

 

Нужно, чтобы при наведении на изображение bbb.gif менялся background-color у <div class="ddd">, при этом, чтобы стиль <div class="bbb"> оставался без изменения.