jQuery Div внутри Div

Question

Я пытаюсь показать фотогалерею с помощью jQuery. Это мой код:

<script> 
     $("#vsetky").click(function(){ 
    $("#obrazky").show(); 
}); 
     $("#c").click(function(){ 
    $("#cervene").show(); 
}); 
</script> 

<div id="obrazky"> 
    <div id="cervene"> 
    <img src="1.png"> 
    <img src="1.png"> 
    </div> 
    <div id="zlte"> 
    <img src="2.png"> 
    <img src="2.png"> 
    </div> 
    <div id="zelene"> 
    <img src="3.png"> 
    <img src="3.png"> 
    </div> 
</div> 

При нажатии на элемент #vsetky ... Он работает, отображается каждое изображение. Когда элемент #c щелкнут, изображений нет. Я пытался использовать

$("#obrazky > #cervene").show(); 

Я пробовал другие методы, но ничего не работает. Помогите мне, пожалуйста, что я делаю неправильно?

Answer 1

Как выглядит ваш css? Если отображаются оба параметра #obrazky и #cervene: none, то при нажатии кнопки #c вы удаляете только экран: none rule from #cervene, но не его родительская упаковка div # obrazky.

Редактировать: Вы хотите изменить css, чтобы скрывать #cervene, #zlte и #zelene, а затем показывать и скрывать их в отдельности с помощью javascript. Если родитель элемента имеет отображение: none, то «show()» с ним с javascript ничего не значит, потому что вы не удаляете отображение: ни один из родителя.

<script> 
    $("#vsetky").click(function(){ 
     $("#cervene, #zlte, #zelene").show(); 
    }); 
    $("#c").click(function(){ 
     $("#cervene").show(); 
    }); 
</script> 

<style> 
    #obrazky {display:inline-block;} 
    #cervene, #zlte, #zelene {display:none;} 
</style> 

<div id="obrazky"> 
    <div id="cervene"> 
     <img src="1.png"> 
     <img src="1.png"> 
    </div> 
    <div id="zlte"> 
     <img src="2.png"> 
     <img src="2.png"> 
    </div> 
    <div id="zelene"> 
     <img src="3.png"> 
     <img src="3.png"> 
    </div> 
</div>