Remove Single Child At Index

There's examples to detach all children after a given index (like this one), but nothing to just remove one. Things I have tried (which are obviously incorrect): this.element.find

Solution 1:

You can use eq() to target an element in a collection by its index. Try this:

this.element.find('.nav-tabs').children().eq(index).remove();

Example Fiddle

The reason splice() and slice() don't work for you is because they return an array of DOMElements, not a jQuery object.

Solution 2:

If the community is also interested in a pure javascript solution. Here's mine.

The parameter 'el' represents any DOM element. 'index' refers to the 'el' childnode you desire to remove.

functionremoveSpecificNode(el, index) {
    var children = el.children;
    if(children.length > 0) {
        el.removeChild(children[index]);
    }
}

And with offset. Removes all childnodes to the given offset.

functionremoveNodesToOffset(el, offset) {
    var children = el.children;
    for(var i=children.length-1;i>=0+offset;i--)
        el.removeChild(children[i]);
}