Issue
I need to move a <div>
inside another as a first child. Suppose, I have a <div class="wrap">
within its parent <div id="wpbody-content">
. Now, I need to attach a <div>
inside the <div class="wrap">
as a first child. Here is my code that I tried:
document.addEventListener("DOMContentLoaded", function(event) {
const div = document.createElement('div');
div.className = 'row';
div.innerHTML = '<input type="text" name="name" value="" />\
<input type="text" name="value" value="" />\
<label> <input type="checkbox" name="check" value="1" /> Checked? </label>\
<input type="button" value="-" >';
document.getElementById("wpbody-content").getElementsByClassName("wrap")[0].insertBefore(div, document.getElementById("wpbody-content").getElementsByClassName("wrap").firstChild);
});
But it appends the <div>
as the last child.
Solution
Use a function that arranges append like this function prependEle(parent, child);
See the very bottom of js
code:
document.addEventListener("DOMContentLoaded", function (event) {
var div = document.createElement('div');
div.className = 'row';
div.innerHTML = '<input type="text" name="name" value="" />\
<input type="text" name="value" value="" />\
<label> <input type="checkbox" name="check" value="1" /> Checked? </label>\
<input type="button" value="-" >';
var wp = document.getElementById("wpbody-content");
var firstWrap = wp.getElementsByClassName("wrap")[0];
prependEle(firstWrap, div);
});
function prependEle(parent, child) {
parent.insertBefore(child, parent.firstChild);
};
Answered By - zer00ne
0 comments:
Post a Comment
Note: Only a member of this blog may post a comment.