Jquery problem?

Question

I have jquery issues that I have had for several days, I'm so new to this, so excuse my dumbness in this matter. thank:))

html code:

<ul class="statuses">
<li id="set_23" class="message">
  // this is meant to increase everytime you click the vote_up just like stackoverflow 
  <span class="vote_count">27</span>
  <a href="#" class="vote_up"><img src="img/uparrow.png" /></a>
  <a href="#" class="vote_down"><img src="img/downarrow.png" /></a>

 </li>

</ul>

this is my jquery code:

$(document).ready(function() {
    $('#statuses').delegate('.vote_up', 'click', function() {
       //get the id
        var the_id = $(this).closest('.message').attr('id').split('_').pop();
        //the main ajax request
        $.ajax({
            type: "POST",
            data: "action=vote_up&id=" + the_id,
            url: "ajax/votes.php",
            success: function (msg) {
                  // fade in the new vote_count
                $(this).siblings("span.vote_count").html(msg).fadeIn();
                  // get the child <img> and set its src
                $(this).children("img").attr("src", "img/uparrowActive.png");
            }
        });
    });

});

EDIT: also jquery fade.in and src image change doesn’t work, I refer to the right range or class (now ajax request is executed)

Answer 1

The first thing to jump out is:

<ul class="statuses"> 

and

$('#statuses')

... the # character in jQuery is an id selector (same as CSS). Since yours is <ul>set to class="statuses", you will need to use the class selector:

$('.statuses')

Only this will break all your jQuery

Answer 2

From jQuery docs:

, , dataFilter, , . , $.ajax ; , Ajax.

, context: this ajax.

Answer 3

Change it

var the_id = $(this).closest('.message').attr('id').split('_').pop();

to that

var the_id = $(this).parents('.message').attr('id').replace('set_', '');

or alternatively

var the_id = $(this).parent().attr('id').replace('set_', '');

if you know that your parent link element will always be ul.message.