En el siguiente ejemplo, intento actualizar el valor de #viewer_campaign3 con datos nuevos y mover los valores anteriores a otros elementos HTML. Pero creo que lo que pasa es que termino sobrescribiendo los datos antiguos.
$('#viewer_campaign1').html($('#viewer_campaign2')); $('#viewer_campaign2').html($('#viewer_campaign3')); $('#viewer_campaign3').html("new data"); <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <div class="section clearfix impact"> <div class="col-md-8 col-md-offset-2"> <h2 class="mb-30"><span><i class="fa fa-refresh fa-spin fa-fw"></i></span>Live</h2> <div class=""> </div> <div class="stats mt-30 .col-xs-6 .col-sm-3"> <div class="col-md-4"> <i class="fa fa-heart"></i> <p>Demo1<span id="viewer_donation_amount1"></span><br><a href="" id=viewer_campaign1>Hello Campaign1</a><p> </div> <div class="col-md-4 .col-xs-6 .col-sm-3"> <i class="fa fa-heart"></i> <p>Demo2<span id="viewer_donation_amount2"></span><br><a href="" id=viewer_campaign2>Hello Campaign2</a><p> </div> <div class="col-md-4 .col-xs-6 .col-sm-3"> <i class="fa fa-heart"></i> <p>Demo3<span id="viewer_donation_amount3"></span><br><a href="" id=viewer_campaign3>Hello Campaign3</a><p> </div> </div> </div> </div>Cualquier ayuda es apreciada
En su .html() en $('#viewer_campaign1') y $('#viewer_campaign2') , en realidad no está asignando el valor .html() de cada uno de los elementos correspondientes según lo previsto.
Así que cambia esto
$('#viewer_campaign1').html($('#viewer_campaign2')); $('#viewer_campaign2').html($('#viewer_campaign3'));A esto
$('#viewer_campaign1').html($('#viewer_campaign2').html()); $('#viewer_campaign2').html($('#viewer_campaign3').html());Esto asignará los valores que desea. Hubo ediciones menores que hice en el código completo a continuación, pero estos cambios fueron todo lo que necesitó para actualizar adecuadamente.
$('#viewer_campaign1').html($('#viewer_campaign2').html()); $('#viewer_campaign2').html($('#viewer_campaign3').html()); $('#viewer_campaign3').html("new data"); <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <div class="section clearfix impact"> <div class="col-md-8 col-md-offset-2"> <h2 class="mb-30"><span><i class="fa fa-refresh fa-spin fa-fw"></i></span>Live</h2> <div class=""> </div> <div class="stats mt-30 .col-xs-6 .col-sm-3"> <div class="col-md-4"> <i class="fa fa-heart"></i> <p>Demo1<span id="viewer_donation_amount1"></span><br><a href="" id="viewer_campaign1">Hello Campaign1</a> <p> </div> <div class="col-md-4 .col-xs-6 .col-sm-3"> <i class="fa fa-heart"></i> <p>Demo2<span id="viewer_donation_amount2"></span><br><a href="" id="viewer_campaign2">Hello Campaign2</a> <p> </div> <div class="col-md-4 .col-xs-6 .col-sm-3"> <i class="fa fa-heart"></i> <p>Demo3<span id="viewer_donation_amount3"></span><br><a href="" id="viewer_campaign3">Hello Campaign3</a> <p> </div> </div> </div> </div>