Question

$("a").each(function() { openFile($(this).attr('href')); }

I got this from another question. openFile is a function that switches the img src depending on the file extension of the link.

now if i have this:

<a class="thelink" href="../General Reading/General Reading 1/Luddites/Luddites 4 Summary.pdf"><img class="theimage" src="" alt="icon"/> <div class="thefile"></div></a>
<a class="thelink" href="../General Reading/General Reading 1/Luddites/Luddites 5 Reading.pdf"><img class="theimage" src="" alt="icon"/> <div class="thefile"></div></a>
<a class="thelink" href="../General Reading/General Reading 1/Luddites/Luddites 1 Vocab.ppt"><img class="theimage" src="" alt="icon"/> <div class="thefile"></div></a>    
<a class="thelink" href="../General Reading/General Reading 1/Luddites/Luddites 2 Grammar Preview.ppt"><img class="theimage" src="" alt="icon"/> <div class="thefile"></div></a>

My function is only run once at the end I guess and takes the info from the last url. What I want is to loop through each link and change the info depending on that specific link.

Err hard to explain.

Answer 1

This way the openFile function doesn’t know which image to target. Maybe this will work instead?

$("a").each(function() {
  var src = openFile($(this).attr('href'));
  $(this).find('img').attr('src',src);
});

function openFile(href) {
  // do stuff
  // and make sure the src is returned
  return 'something';
}

Or add the image object to the openFile function so you can target it from there:

$("a").each(function() {
  var img = $(this).find('img');
  openFile($(this).attr('href'), img);
});

function openFile(href, img) {
  // do stuff
  img.attr('src', something);
}

Or simply incorporate the openFile functionality to the jQuery call:

$("a").each(function() {
  // do stuff with $(this).attr('href')
  // change $(this).find('img').attr('src',src);
});