Add image to Array.push element

Question

I am using select controls to cascade a filter selection going from league, team, to player. I was trying to add a player profile image to each player but I can't seem to add an img within an Array.push. Any thoughts on how to render an image next to the player's name with the select control? I have the cascading filter setup for numerous values so I'm trying to not have to create new logic for the cascading select controls and their array of values if possible.

My current code is:

    playerLists["MIN - Minnesotta Vikings"].push(["Player 1"]);         
    playerLists["ARI - Arizona Cardinals"].push(["Player 1"]);          
    playerLists["DAL - Dallas Cowboys"].push(["QB Tony Romo "]);    
    playerLists["DAL - Dallas Cowboys"].push(["RB Tyler Clutts"]); 
    playerLists["DAL - Dallas Cowboys"].push(["WR Cole Beasley"]); 

...etc....

Thanks for any help you can give.

Answer 1

Why you just do not push the image url and use it like this :

playerLists["MIN - Minnesotta Vikings"].push({ name: "Player 1", url: "/path_to_image.png" });         
playerLists["ARI - Arizona Cardinals"].push({ name: "Player 2", url: "/path_to_image.png" });         
playerLists["DAL - Dallas Cowboys"].push({ name: "Player 3", url: "/path_to_image.png" });         
playerLists["DAL - Dallas Cowboys"].push({ name: "Player 4", url: "/path_to_image.png" }); 

After that, when you make an iteration you can do :

_.each(playerLists, function(player){
  console.log(player.name);
  console.log(player.url);
})

(To use _.each, you have to install http://underscorejs.org/ )