Question

I have been looking for a function in jquery that will let me just “copy and paste” the text within a certain element, i.e. a <li> or inside a <div> and put it into another element. This should be done without destroying the element that the text is being copied from.

I have a jsfiddle document which demonstrates my best attempt and a more practical description: http://jsfiddle.net/HDBLd/

Thanks very much.

P.S I would like to clarify that I don’t want the text inside the element to be copied to the users clipboard, just copied to the other element.

Answer 1

To send the HTML from one element to another you can simply use the html() output from the original element as the source for the target, like this:

jQuery($ => {
  $('li').on('click', function() {
    $('#lorem').html($(this).html());
  });
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.3/jquery.min.js"></script>
<div id="lorem">
  This is the text that should change
</div>

<div id="impsum">
  <ul>
    <li>This is the text that will replace the other piece of text. I need to find a function that will just copy the text in here - not the whole li with the bullet as well.</li>
  </ul>
</div>

Note that you can also use text() instead of html() if you want to ignore any HTML inside the original element.