Dynamically replace image source with jQuery

jquery replace image src yelp
David Hubler picture David Hubler · Jun 21, 2012 · Viewed 44.5k times · Source

I'm trying to replace the default Yelp star rating image for businesses with one of my own. To do so I need to find the corresponding image source for each of the possible 5 images that could have loaded. And then, based on that I need to load in the proper image I've created.

<div id="starRating">
    <img src="http://yelp-star-1.png"/>
</div>

So, yelp-star-1.png would be replaced with my-star-1.png. So on and so forth. This is probably pretty simple, but I'm new to jQuery and everything I've found has not worked properly. Your expertise is very much appreciated!

Answer

JeremyWeir picture JeremyWeir · Jun 21, 2012 
$("#starRating img").attr("src", "http://pathto/my-star-1.png")

EDIT

I think that you're asking how to dynamically replace the src based on what is there currently. So if there is some direct difference in strings, maybe try

var img = $("#starRating img");
img.attr("src", img.attr("src").replace("yelp", "my"));

Related questions

Using jQuery to change image src when browser is resized

I have two different sized images, one if for screens smaller than 759px, the other is for screens larger than 759px. I have managed to get the source of the images to change when the document loads depending on the …

Read More
jQuery - replace all instances of a character in a string

This does not work and I need it badly $('some+multi+word+string').replace('+', ' ' ); always gets some multi+word+string it's always replacing for the first instance only, but I need it to work for all + …

Read More
jQuery removing '-' character from string

I have a string "-123445". Is it possible to remove the '-' character from the string? I have tried the following but to no avail: $mylabel.text("-123456"); $mylabel.text().replace('-', '');

Read More