How to append in Jquery html code with existing css still used

Question

I have this function in java script

function appendAllQna(qnaList, num){
    for (var i in qnaList){ 
        var qnaCom = "";
        qnaCom += "<div class='scomment scommentLine'>";
        if(qnaList[i].sellerYn == "Y"){
            qnaCom += "<div class='avatar defaultstore'>";
        }else{
            qnaCom += "<div class='avatar defaultuser'>";
        }
        qnaCom += "<img src=''></div><table class='subTab'>";
        qnaCom += "<tbody><tr><td class='infoME'>";     
        if(qnaList[i].sellerYn == "Y"){
            qnaCom += "<span class='name'>";
            qnaCom += qnaList[i].nickNm;
            qnaCom += "</span><span class='badge'></span>";
        }else{
            qnaCom += "<span class='name'>";
            qnaCom += qnaList[i].memNM;
            qnaCom += "</span>";
        }
        var page = document.getElementById("addMoreQna"+num);
        page.append(qnaCom);
    }
}

and this is the div I declare to be appended in my jsp

<div id="addMoreQna<%= i%>"></div>

I want to append so the html will appear also with the css existing in page. But the result is only the code appears like this:

<div class='scomment scommentLine'><div class='avatar defaultuser'><img src=''></div><table class='subTab'><tbody><tr><td class='infoME'><span class='name'>Putri</span><div class='scomment scommentLine'><div class='avatar defaultuser'><img src=''></div><table class='subTab'><tbody><tr><td class='infoME'><span class='name'>Putri</span><div class='scomment scommentLine'><div class='avatar defaultuser'><img src=''></div><table class='subTab'><tbody><tr><td class='infoME'><span class='name'>Putri</span><div class='scomment scommentLine'><div class='avatar defaultuser'><img src=''></div><table class='subTab'><tbody><tr><td class='infoME'><span class='name'>undefined</span>enter code here

Not the right apprearance. What should I do? Thanks in advance. Anyway I'm still beginner :D

Could you explain more what your question is, do you want to know how to append a div with an class or id? or do you want to move a div or?? — Ricardo van Laarhoven
– Ricardo van Laarhoven, Commented Mar 2, 2017 at 9:35
I want to show html view, but in fact it's appearing the code. — vse
– vse, Commented Mar 2, 2017 at 10:02

lazarus · Accepted Answer · 2017-03-02 09:43:41Z

1

append is a jquery method but you are using it as if it were a javascript method.

to use the jquery method use:

$('#addMoreQna' + num).append(qnaCom);

or if pure js:

page.innerHTML += qnaCom;

edited Mar 2, 2017 at 9:43

answered Mar 2, 2017 at 9:38

lazarus

3832 silver badges11 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

lazarus Over a year ago

Glad to help, if this answer solved your problem please mark it as accepted by clicking the check mark next to the answer.

Collectives™ on Stack Overflow

How to append in Jquery html code with existing css still used

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related