jQuery - выбирает группы дочерних элементов на основе родительского элемента DIV

Question

У меня есть обычная HTML-страница с такими вещами, как div и ссылки с изображениями:

<div>
  <a href="foo.jpg"> ... </a>
  <a href="boo.jpg"> ... </a>
</div>

<div>
  <a href="bah.jpg"> ... </a>
  <a href="gah.jpg"> ... </a>
</div>

...

Я пытаюсь подключить скрипт lightbox ко всем ссылкам, которые заканчиваются расширениями jpg / gif / png.

Прямо сейчас, основываясь на предыдущем вопросе, который я задал :), у меня есть:

 $('div a').filter(function(){
   return this.href.match('[\.jpg|\.png|\.gif]$');
 }).colorbox({
   rel: 'gallery'
 });

, который группирует все ссылки внутри gallery.

Но я бы хотелгрупповые ссылки из каждого div внутри своей галереи.Например, ссылки .foo '& .boo внутри gallery1 и .bah & .gah внутри gallery2 и так далее ...

Как я могу это сделать?

Answer 1

$('div').each(function(index) {
   $(this).find('a').filter(function(){
       return this.href.match('[\.jpg|\.png|\.gif]$');
   }).colorbox({
       rel: 'gallery' + index
   });
});

Answer 2

(извините, не могу прокомментировать другой ответ)

Вашему регулярному выражению нужны скобки, а не скобки:

(\.jpg|\.png|\.gif)$

в противном случае вы в буквальном смысле совпадаетесимволы .jpgpnif| и имя файла foo| совпадают.