CODEWITHSUNDEEP
jquery
MShack
MShack

Reputation: 652

How would i wrap each image I added with jQuery with a link also

With some help , i was able to replace some text with an image for each member

$( "#chatscroll" ).html( $( "#chatscroll" ).html().replace('Fighting Moose Knuckles', '<img src="http://larryvasta.com/football/img/icons/Moose_Icon.png" />') );

$( "#chatscroll" ).html( $( "#chatscroll" ).html().replace('Grundle Goblins', '<img src="http://larryvasta.com/football/img/icons/Goblins_Icon.png" />') );

$( "#chatscroll" ).html( $( "#chatscroll" ).html().replace('Commissioner', '<img src="http://larryvasta.com/football/img/icons/Commish_Icon.png" />') );

I need to add a link to each image to direct them to their profile page.

Upvotes: 0

Views: 46

Answers (3)

Andr&#233; Snede
Andr&#233; Snede

Reputation: 10045

How about introducing a bit of reusability.

function replaceTextWithImage($element, str, imageSrc){
    $element.html($element.html()
                  .replace(str, '<a href="#"><img src="'+ imageSrc +'"></a>'));
}

var $chatScroll = $("#chatscroll");
replaceTextWithImage($chatScroll, 'Fighting Moose Knuckles','http://larryvasta.com/football/img/icons/Moose_Icon.png');
replaceTextWithImage($chatScroll, 'Grundle Goblins','http://larryvasta.com/football/img/icons/Goblins_Icon.png');
replaceTextWithImage($chatScroll, 'Commissioner','http://larryvasta.com/football/img/icons/Commish_Icon.png');

Upvotes: 0

Henri Hietala
Henri Hietala

Reputation: 3041

How about just add the links to your existing code? See the <a href="#"> in the example below:

$( "#chatscroll" ).html( $( "#chatscroll" ).html().replace('Fighting Moose Knuckles', '<a href="#"><img src="http://larryvasta.com/football/img/icons/Moose_Icon.png" /></a>') );

$( "#chatscroll" ).html( $( "#chatscroll" ).html().replace('Grundle Goblins', '<a href="#"><img src="http://larryvasta.com/football/img/icons/Goblins_Icon.png" /></a>') );

$( "#chatscroll" ).html( $( "#chatscroll" ).html().replace('Commissioner', '<a href="#"><img src="http://larryvasta.com/football/img/icons/Commish_Icon.png" /></a>') );

Upvotes: 2

Rajaprabhu Aravindasamy
Rajaprabhu Aravindasamy

Reputation: 67207

Try to use .wrap() at this context, 

$('#chatscroll img').wrap('<a href="yourLink.com"></a>');

Upvotes: 1

Related Questions