I have 12 games that I need to sort through that each have a date and img string.  I'm fairly new to jQuery and was wondering what is the best way to accomplish this. Is there a way that I can run this through a loop of some sort rather than having 12 else-if statements like I currently have (code condensed to 3 for readability)? This code works, I was just looking for the cleaner more concise way of writing it.var now = new Date();boise = { date: new Date ('May 15, 2012'), img: 'Boise' };central = { date: new Date ('May 21, 2012'), img: 'Central' };notreDame = { date: new Date ('May 27, 2012'), img: 'NotreDame' };    ...banner = $('#nextGameBanner');imgDir = 'images/nextGame';if (now < boise.date ) {    banner.attr('src', imgDir+boise.img+'.jpg');}else if (now < central.date) {    banner.attr('src', imgDir+central.img+'.jpg');}else if (now < notreDame.date) {    banner.attr('src', imgDir+notreDame.img+'.jpg');}    ...HTML<img src=/website/images/nextGame.jpg id=nextGameBanner />
Finding image by date
javascript;jquery;datetime
Try something like this:if (now.getTime() < boise.date.getTime() ) {    banner.attr('src', imgDir+boise.img+'.jpg');}.....In total,var now = new Date();    objs = {         // here I change your 12 variables to a single object, so I can loop over them        boise : { date: new Date ('May 15, 2012'), img: 'Boise' },        central : { date: new Date ('May 21, 2012'), img: 'Central' },        notreDame : { date: new Date ('May 27, 2012'), img: 'NotreDame' }    },    banner = $('#nextGameBanner'),    imgDir = 'images/nextGame';// making loop with objs$.each(objs, function(key, singleObj) {    // compare time with now and stored time in object   if (now.getTime() < singleObj.date.getTime() ) {     // assigning src to image when the condition satisfied     banner.attr('src', imgDir+ singleObj.img +'.jpg');     break; // stop the loop when match found   }});read about getTime()