Home/ Questions/Q 6049461
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-23T07:34:47+00:00

I’m creating a quoting system within a custom bulletin board. What I need to

  • 0

I’m creating a quoting system within a custom bulletin board.

What I need to do is to copy the contents of one div, but place it in a text-area with additional elements.

Could I use jQuery in assisting me to do this?

How would I do this?

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    Manipulate string and then copy

    This is probably what you’re after:

    var stringContent = $("#SourceDivID").html();
$("#TextAreaID").val("This is content:\n" + stringContent);

    Then you can easily manipulate your textarea content at your own will. This will copy the whole DIV sub-tree (including all elements) not just textual content. But you have to be aware that DIV’s content becomes a string.

    Manipulate HTML elements and then copy

    If you’d like to manipulate HTML elements then do it this way:

    var div = $("#SourceDivID").clone();
// manipulate
$("#SomeSubElementID", div).append(/* add something inside at end */);
$("#SomeSubElementID", div).prepend(/* add something inside at start */);
div.before(/* add something in front */);
div.after(/* add something after it */);
...
// add to textarea
$("#TextAreaID").val(div.html());

    Using .text() or .html()

    If you’d only need to use textual content then use .text() instead .html(). Example:

    <div id="test">
    Some text <strong>emphasized.</strong>
</div>

    What each of these returns:

    $("#test").text() => "Some text emphasized."
$("#test").html() => "Some text <strong>emphasized.</strong>"

    Wrapping content in a new element

    If you’d like to wrap the whole content inside a new element and then copy (this would be something common for a forum post) do it this way:

    var div = $("divID").clone();
// wrap it
div = div.wrap("<quote/>").parent();
// display in textarea
$("textareaID").val(div.wrap("<div/>").parent().html());

    Why do we have to wrap it twice? Because .html() only returns inner HTML of an element. So if we want to return wrapped content as well, we have to wrap it again and then display inner HTML of the newly wrap element. That’s the only reason why double wrapping is required.

    JSFiddle examples

    • Wrapping all text between [quote] and [/quote]: click here
    • Wrapping all elements inside <quote> element: click here
    • 0