westcoast_509 westcoast_509 - 5 months ago 12
jQuery Question

How can I use jquery to move text from multiple elements in order?

I want to move text from multiple elements to other elements in order. I don't want to move the element, just the inner text. The setup is basically:

<p class='button_text'>Text here.</p>
<p class='button_text'>More text here.</p>


`

<div class="button">Button 1</div> <div class="button">Button 2</div>


Which I tried to change with:

var button_text = $('.button_text').html();
$('.button').html(button_text);


which produces

<div class="button">Text here.</div>
<div class="button">Text here.</div>


But I want it to produce:

<div class="button">Text here.</div>
<div class="button">More text here.</div>


Help much appreciated!

Answer

You can try looping through the p tags first. like -

$(document).ready(function(){
            var btn = $('.button_text');
            var index = 0;
            $('.button').each(function(){
                $(this).html($(btn[index]).text());
                index++;
            });
    });