javascript - Adding child to parent in Jquery using variables -
i'm trying dynamically creating div inside div using jquery. when dump child nodes div1, shows text , strong. expecting 'div1' have main_div_elem child , main_div_elem have col_md_8_elem child.
can me add col_md_8_elem child of main_div_elem , main_div_elem child of 'div1'?
output of console log js function.
nodelist [ #text "here", ]
code:
var id = 1; function trythis() { $( "#div1" ).append( "<strong>hello</strong>" ); var main_div_elem = $('<div /', {id : 'main_div_elem'.concat(id), "class" : "row"}); var col_md_8_elem = $('<div /', {id : 'col_md_8_elem'.concat(id), "class" : "col-md-8"}); main_div_elem.append(col_md_8_elem); $('#div'.concat(id)).append(main_div_elem); var children = document.getelementbyid("div1").childnodes; console.log(children); } trying achieve following htm code using jquery.
<div class="row"> <div class="col-md-8"> </div> </div> thanks, deepak
hello can try below code .i write differently hope
$(document).ready(function() { var id = 1; var main_div_elem = "<div id=main_div_elem class='row'></div>" var main_div_elem8 = "<div id='col_md_8_elem' class='col-md-8'></div>" $("#div1").append(main_div_elem); $("#main_div_elem").append(main_div_elem8); var children = $("#div1").html(); console.log(children); });#div1 { height: 100px; width: 100px; position: absolute; padding: 10px; background-color: red; } #main_div_elem { height: 50px; width: 50px; position: absolute; padding: 10px; background-color: green; } #col_md_8_elem { height: 20px; width: 20px; position: absolute; padding: 10px; background-color: blue; }<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.3/jquery.min.js"></script> <div id="div1"></div>
Comments
Post a Comment