jQuery selector: which combination of jQuery selectors should I use to change the text between span tags

I have the following HTML:

<tr>
  <td>
    <img id='1' class='promote' src='/images/plus.png' />
    <span>0</span>
    <img id='1' class='demote' src='/images/minus.png' />
  </td>
  <td>
    <img id='2' 开发者_运维技巧class='promote' src='/images/plus.png' />
    <span>0</span>
    <img id='2' class='demote' src='/images/minus.png' />
  </td>
...
</tr>

Next, i'm using jQuery ajax:

$('img.promote').click(function() {
  $.ajax({
    url: '/promote/' + this.id,
    success: function(data) {
      $(???).text(data.rating);
    },
    dataType: 'json'
  });
});
$('img.demote').click(function() {
  $.ajax({
  url: '/demote/' + this.id,
  success: function(data) {
    $(???).text(data.rating);
  },
  dataType: 'json'
  });
});

So, which combination of jQuery selectors should I use instead of "???" to change the text between span tags? or I'm doing it wrong at all?

You need to cache the span in the click handler

$('img.promote').click(function() {
  var $span = $(this).siblings('span');
  $.ajax({
    url: '/promote/' + this.id,
    success: function(data) {
      $span.text(data.rating);
    },
    dataType: 'json'
  });
});