javascript - Dynamically added element not showing in view -

i trying dynamically add element div. element not shown in view. if try inspect element new paragraph not there(this seems normal behavior of inspect element i've read). go in console , select element through javascript , new elements there can't seen.

<div id="moving_to_2perf"> da <p> paragraph</p> </div>  <style type="text/css">   #moving_to_2perf{   color: red; };      </style>    <script type='text/javascript'>    function getcookie(cname) {       var name = cname + "=";       var ca = document.cookie.split(';');       for(var = 0; <ca.length; i++) {           var c = ca[i];           while (c.charat(0)==' ') {               c = c.substring(1);           }           if (c.indexof(name) == 0) {               return c.substring(name.length,c.length);           }       }       return "";   }    function setcookie(cname, cvalue, exdays) {     var d = new date();     d.settime(d.gettime() + (exdays*24*60*60*1000));     var expires = "expires="+ d.toutcstring();     document.cookie = cname + "=" + cvalue + "; " + expires;   }    $( document ).ready(function() {     console.log('salut1');     insert_text();   });    cookie = getcookie('2parale_to_2performant_cokie');   if (!cookie) {     insert_text2();   };    function insert_text(){     console.log('salut2');     var para = document.createelement("p");     var node = document.createtextnode("this new.");     para.appendchild(node);      var element = document.getelementbyid("moving_to_2perf");     element.appendchild(para);   };    function insert_text2(){     console.log('salut3');     $("#moving_to_2perf").html("hello world");     $("#moving_to_2perf").append('<p id="testp"> test </p>');      console.log($('#testp').position());     console.log($('#testp').offset());   };   </script> 

the elements there, can't see them. can see original elements however. ?