Скрытие элементов с JS

Question

UPDATE:

Я изменил мой сценарий к этому, и это работает. Путь проще, и он работает.

  function myFunction(valor) {    
       var elementos = document.getElementsByClassName("inner"); 
       var i; 
       for (i = 1; i < elementos.length+1; i++) { 
         document.getElementById("age"+i).style.visibility = "hidden"; 
       } 
       document.getElementById("age"+valor).style.visibility = "visible"; 
     } 

---

У меня есть этот скрипт:

function myFunction(valor) { 
    alert("Has seleccionado " + valor); 
    var elementos = document.getElementsByClassName("inner"); 
    //alert ("Tienes " + elementos.length + " elementos."); 
    var i; 
    for (i = 1; i < elementos.length + 1; i++) { 
     var sty = document.getElementById("age" + i); 
     //alert("age"+i); 
     if (getComputedStyle(sty).getPropertyValue("visibility") == "hidden") { 
      document.getElementById("age" + valor).style.visibility = "visible"; 
     } else { 
      document.getElementById("age" + i).style.visibility = "hidden"; 
     } 
    } 
} 

Это я контролирую с ползунком. То, что я делаю, скрывает или показывает некоторые divs в зависимости от того, что я выбираю из слайдера.

Это, как я пишу свои данные, прежде чем пытаться скрыть или shsow элементы с помощью ползунка:

$(window).load(function() { 

    $.getJSON('http://xxxxx/xxxxx.json', function(data) { 
     var output = "<ul class='lista'><div class='outer'>"; 
     for (var i in data.lbclassic) { 
      output += "<div style='visibility:hidden;' class='inner'id=" + "age" + data.lbclassic[i].ageinweeks + ">" + "<p>" + data.lbclassic[i].ageinweeks + "--" + data.lbclassic[i].cumul + "--" + data.lbclassic[i].perhh + "--" + data.lbclassic[i].perhd + "--" + data.lbclassic[i].eggweightinweek + "--" + data.lbclassic[i].eggmasscumul1 + "--" + data.lbclassic[i].eggmassinweek + "--" + data.lbclassic[i].eggmasscumul + "</p></div>"; 
     } 
     output += "</div></ul>"; 
     document.getElementById("placeholder").innerHTML = output; 
    }); 
}); 

Это прекрасно работает, пока в один момент - когда я добираюсь до последнего элемента (90 в данном случае), он не появится.

Answer 1

function myFunction(valor) {    
     var elementos = document.getElementsByClassName("inner"); 
     var i; 
     for (i = 1; i < elementos.length+1; i++) { 
       document.getElementById("age"+i).style.visibility = "hidden"; 
     } 
     document.getElementById("age"+valor).style.visibility = "visible"; 
} 

Answer 2

Не проще ли использовать css "display: none;" функция для удаления элемента.

.yourclass{ 
    display:none; 
} 

просто изменить класс с Js

Link to CSS