Search code examples
javascriptjqueryimagesrc

changing the image in jquery?


i have this jquery code which works fine, but the image at the end is not changing to the src i specified here:

jquery:

    $(document).ready( function() {
      $("a.vote_up").click(function(){
        //get the id
        var the_id = $(this).attr('id');

        //the main ajax request
        $.ajax( {
          type: "POST",
          data: "action=vote_up&id=" + the_id,
          url: "ajax/votes.php",
          success: function( msg ) {
            $("span.vote_count#"+the_id).html(msg).fadeIn();
// my problem is here 
            $(".vote_up#" + the_id + " img").attr("src", "img/upvoteActive.png");
          }
        } );
      } );
    } );

the html code:

<a href='#' class='vote_up' id="$id"><img src="img/uparrow.png" /></a>

Solution

  • Don't use class in combination with ID; it is redundant because ID should always be unique...

     $("#" + the_id + " img").attr("src", "img/upvoteActive.png");
    

    Also, you cannot use the character $ in the ID attribute. To quote the W3C on the ID attribute...

    ID and NAME tokens must begin with a letter ([A-Za-z]) and may be followed by any number of letters, digits ([0-9]), hyphens ("-"), underscores ("_"), colons (":"), and periods (".").