javascript - use jquery to insert html code -

i new jquery , html. trying insert code in jquery class="content" in html code check console , reaches loaddoc() function. tried .html , .append both did not work.

html code

    <section id="doc" class="main">        <div class="content">        </div>     </section> 

jquery code

    function loaddoc(){        console.log("load doc");        var content = '<header>this header</header><article>' +        '<p>this content form loaddoc() </p></article>';        $( "section#doc.content" ).append( content );     } 

you want #doc .content instead of section#doc.content since goal insert html .content element located in #doc element.

function laoddoc(){    console.log("load doc");    var content = '<header>this header</header><article>' +    '<p>this content form loaddoc() </p></article>';    $( "#doc .content" ).append( content ); }