Add HTML to HTML string in jQuery

Question

I have an HTML line and I want to add another html line to it in any arbitrary place.

Example:

var htmlString = '<div id="insert"> <p> Hello </p> </div>'

var appendString = '<p> Goodbye </p>'

$(appendString).appendTo( $(htmlString).find('#insert') )

Obviously, this does not work because it cannot be inserted directly into the string, I do not want to convert the htmlString to a jQuery object, because it messed up the structure of the HTML document, and I need script tags to stay in the places where they were inserted.

Hope this is clear enough.

EDIT:

My apologies, I think I did not explain my problem well.

I have an HTML row that contains a table, and I want to add a new row to the table. My problem is that I have some tags <script>that I need to leave in their places. When I convert a string to a string $ (string), then I cannot return it to its original form:

var htmlString = $('body').html();
var $htmlString = $(x);
console.log($htmlString.html());

Confluence, , ; , , , .

HTML AJAX Confluence, , , .

JS Bin , .

https://jsbin.com/ruwawuzica/edit?html,js,output

Answer 1

:

var htmlString = '<div id="insert"> <p> Hello </p> </div>';

var appendString = '<p> Goodbye </p>';
var added = ($(htmlString).append($(appendString)));
$(added).appendTo('div');

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div></div>

Hide result

$(htmlString) - element <div id="insert"></div>, jquery

Answer 2

@MyLittleDax, , :

var htmlString = "<div id='insert'> <p> Hello </p> </div>";
var appendString = "<p> Goodbye </p>";
//your container where you put the html
var container = $('#container'); 
container.empty();
container.append(htmlString);
var insert = $('#insert');
insert.append(appendString);

!!!