Why aren't my images changing when I change their source attribute -JQuery Mobile & Phone Gap

I'm writing a jquerymobile / phonegap application where I need small icons to change depending on what the user selects from a drop down, or depending on different values coming back from the database.

Here is a quick snippet of the code

        if(sqlData[0][6]==1){
            myAlert('urgent');
开发者_如何学Python            $('#icon3s').attr("src", './icons/Urgent.png');
        }else{
            myAlert('not urgent');
            $('#icon3s').attr("src",'./icons/not_urgent.png');
        }
         $('img').each(function(){
             console.log($(this).attr('id')+" src = "+$(this).attr('src'));
        });

As you can see, after changing the image source I went ahead and printed out all the images just to make sure the source was being set correctly and it is....

The image itself doesn't change though, even though the attribute has been successfully updated...

Thanks!

Really old post, but I ran into the same issue (also using Phonegap + jQuery Mobile). Upon a tap event firing, I was attempting to change an <img> src to a different image:

HTML:

<div class="profileNavGroup" id="myTeamsGroup">
    <img class="profileNavImage" src="images/tempProfilePic.jpg" />
    <h5 class="profileNavText">My Teams</h5>
</div>

jQuery:

$("#myTeamsGroup").live('tap', function() {
    $("#myTeamsGroup .profileNavImage").attr("src", "images/tempProfilePic.jpg");
}):

This wasn't working, and after fiddling with it for an hour so I realized it was the image file. After changing it to a different image, the image updated correctly.

Moral of the story: Perhaps the image you're using just isn't showing up? Try changing it to another image (or change your image's file type) and see if that helps. My image showed fine when previewing in windows or any other application, but it would never show up in my android app.

When you change the attr. of the image, possibly your element is not getting re-render. Try to replace the element, i think that should work.

If the icon is in a jQuery Mobile type element like a listview, you might need a refresh - like $('#listId').listview('refresh');