Jquery-- Finding the ID of an element in a DIV

Question

Im trying to get the ID of the <div> element here so that i can use it to animate the opacity of the when i hover over the div with class 'module'.

i have set the opacity of all the <div> elements with class 'moduleInfo' to 0. So basically what im trying to do here is when i hover my mouse over the module with ID modulePic_1 i want the corresponding <div> element which in this case is moduleInfo_1 to appear.

hope im making some sense to u all...

<div class="module" id="modulePic_1">
    <div class="moduleTitle">
     <div style="float:left;">d</div>
     <div class="moduleInfo" id="moduleInfo_1"></div>

    </div
    <div class="module1">
</div>

<div class="module" id="modulePic_2">
    <div class="moduleTitle">
     <div style="float:left;">d</div>
     <div class="moduleInfo" id="moduleInfo_2"></div>

    </div>
    <div class="module2">
</div>

Answer 1

If you have a direct correspondence between the _1 values on each entity, you simply need to do a "split" on the original modfulePic_1 value, grab the trailing digit, and then grab the corresponding moduleInfo by constructing the selector:

$('.module').each(function(el){
    var digit = $(el).attr('id').split('_')[1];

    var sibling = $('moduleInfo_' + digit, el);

    $(el).mouseover(function(){ 
        // do something to sibling;
    });

    $(el).mouseout(function(){
        // undo something to sibling;
    });
});

Answer 2

EDIT: Wait, we're all overthinking this. You don't need the ID selectors at all:

$('.module').hover(
  function() { $(this).find('.moduleInfo').show() },
  function() { $(this).find('.moduleInfo').hide() }
);

---

Here's what I had before, if the above doesn't suffice:

function getModNum( className ) {
  return className.split('_')[1];
}

$('.module').hover(
  function() {
    var modNum = getModNum( $(this).attr('id') );
    $('moduleInfo_'+modNum).show();
  },
  function() {
    var modNum = getModNum( $(this).attr('id') );
    $('moduleInfo_'+modNum).hide();      
  }
);