使用父母或兄弟姐妹的jQuery

Question

Hello i have multiple galleries on one page and also using a light-box script. Instead of having to id each gallery differently i think i can use parent or siblings function, but i cant get it working can anyone help?

<div id'gallery'>
<a id='galImage'>.....</a>
<a id='galImage'>.....</a>
<a id='galImage'>.....</a>
</div>

<div id'gallery'>
<a id='galImage'>.....</a>
<a id='galImage'>.....</a>
<a id='galImage'>.....</a>
</div>

<div id'gallery'>
<a id='galImage'>.....</a>
<a id='galImage'>.....</a>
<a id='galImage'>.....</a>
</div>

the script i'm using is

$(function() {
   $('#gallery #imageGal').lightBox({
    overlayBgColor: '#FFF',
   });
});

i've tried

$(function() {
   $("#gallery + #imageGal", this).lightBox({
    overlayBgColor: '#FFF',
   });
});

Answer 1

I would suggest you to use another attribute instead of ID for such purposes. For example:

<div gallery='true'>
  <a galImage='true'>.....</a>
  <a galImage='true'>.....</a>
  <a galImage='true'>.....</a>
</div>

And the script for update:

$(function() {
   $('div[gallery] a[imageGal]').lightBox({
    overlayBgColor: '#FFF',
   });
});