.replaceWith() working only once
<p>I am trying to implement a system of reputation of users in my site. So you can see the rep number after the name of the user every time he interacts (for example, every time he makes a comment). There is also a voting system which also alters the reputation of the user and I want the rep number to reflect that change. So I am calling a file through ajax which returns the new rep number for that user. The html/php file is something like this the first instance (if he makes a post):</p>

<pre><code>echo '&lt;div class="rep_user_id" id="rep_user_id_'.$posts_row['userid'].'"&gt; '.$posts_row['user_rep'].'&lt;/div&gt;';
</code></pre>

<p>and then (if he makes a comment):</p>

<pre><code>echo '&lt;div class="rep_user_id" id="rep_user_id_'.$com_row['userid'].'"&gt;'.$com_row['user_rep'].'&lt;/div&gt;';
</code></pre>

<p>both give me this: </p>

<pre><code>&lt;div class="rep_user_id" id="rep_user_id_110"&gt;293&lt;/div&gt;
</code></pre>

<p>Then the js:</p>

<pre><code>function change_reps() {
var userid = $('.rep_user_id').attr('id').replace('rep_user_id_','');
$.ajax({
 url: "vote/get_reputation.php",
 data: "userid="+userid,
 success: function(server_response){
 $("body").ajaxComplete(function(event, request){
   var reputation = server_response;
   $('#rep_user_id_'+userid).replaceWith(''+reputation);
   $('#rep_user_id_'+userid).effect("highlight", {color:'red'}, 1000);
 });  } });  }
</code></pre>

<p>This function is called after success of another ajax (to update rep and votes). So, from this, what's working: once I click in any arrow up or down I can see the voting counter up or down but I only see the user rep change the very first instance only (post). Why is it changing only once and not throughout the whole document? Has anything to do that the comments section is called from another file (with an include)? FYI the effect works in all instances!
Hope you can help. Thanks</p>

<p><strong>EDIT:</strong> Since I have seen that I didn't explain myself very well I am adding a few more lines. The issue is that I can't modify multiple elements with the same id and class just one time (as opposed to change one element multiple times). So I have 293 many times throughout the page but the code posted is changing only one element!
This is what triggers change_reps():</p>

<pre><code>$("body").on("click", ".vote_com_up", function(){
   var com_id = $(this).attr('id').replace('vote_com_up_','');
   $.ajax({ 
    url: "vote/comment_vote.php",
    data: "com_action=2&amp;com_id="+com_id,
    success: function(server_response){
    $(".vote_com_number").ajaxComplete(function(event, request){
     if(server_response == 'voted')
       { alert("Ya has votado en este post!");}
    else{
       var new_com_votes = server_response; 
       $("#vote_com_number_"+com_id).html(+new_com_votes);
    } }); } 
   }).done(function() {
    change_reps();
   });
   return false;
 }); 
</code></pre>

<p>I made a small jsfiddle to show what I want:</p>

<p><a href="http://jsfiddle.net/CMgYb/1/" rel="nofollow">http://jsfiddle.net/CMgYb/1/</a></p>

<p><strong>SOLUTION:</strong> Bryan Naegele was right: I needed classes instead of ids.</p>
