Как скрыть дочерние элементы с помощью JavaScript

Question

<div id="wpq2"> 
    <div class="subClass"> 
    <a id="linkTO" class="subClass">New Item</a> 
    or 
    <a class="subClass">edit</a> 
    this list 
    </div> 
</div> 

я хочу, чтобы скрыть все вещи, кроме

<a id="linkTO" class="subClass">New Item</a> 

У меня нет доступа к HTML, я использовать яваскрипт

я пытался Somthing

var parentID = document.getElementById('wpq2'); 
var sub = parentID.getElementsByClassName('subClass'); 
var lastChild = sub[0].lastChild; 
lastChild.style.display = 'none'; 

Использование javascript не зная, как это сделать

Пожалуйста, предложите

Answer 1

Попробуйте вместо этого:

var parentID = document.getElementById('wpq2'); 
//get the first inner DIV which contains all the a elements 
var innerDiv = parentID.getElementsByClassName('subClass')[0]; 
//get all the a elements 
var subs = innerDiv.getElementsByClassName('subClass'); 

//This will hide all matching elements except the first one 
for(var i = 1; i < subs.length; i++){ 
    var a = subs[i]; 
    a.style.display = 'none'; 
} 

Here is a working example

---

EDIT:Вышеизложенное только скроет элемент a, поскольку ваши текстовые элементы не содержатся в определенных элементах, тогда это становится более сложным. Если вы счастливы, чтобы эффективно «удалить» HTML, вы не хотите, то вы можете сделать следующее:

var parentID = document.getElementById('wpq2'); 
//get the first inner DIV which contains all the a elements 
var innerDiv = parentID.getElementsByClassName('subClass')[0]; 
//get the HTML for the a element to keep 
var a = innerDiv.getElementsByClassName('subClass')[0].outerHTML; 
//replace the HTML contents of the inner DIV with the element to keep 
innerDiv.innerHTML = a; 

Here is an example

Answer 2

вставить новый HTML, если вам не нужно остальное

document.getElementById('wpq2').innerHTML = '<a id="linkTO" class="subClass">New Item</a>'; 

Answer 3

var parentID = document.getElementById('wpq2'); 
    var innerDiv = parentID.getElementsByClassName('subClass')[0]; 
    var subs = innerDiv.getElementsByClassName('subClass'); 
    subs.forEach(function (sub) { sub.style.display = 'none'; }); 
    document.getElementById("linkTO").style.display = 'block';