Alva Alva - 1 month ago 6
CSS Question

Hiding a Div on Second Click li element

Ich wrote following code for hiding and showing divs when different li objects are clicked, everything works fine, the only problem is i would like that a div for example hides the second time i click on the very same li object clicked before...
How can i achieve that?

<script>
$(".col-md-1-5").on("click", function() {
$(".containerDays").css("display", "none"); $("#" + $(this).attr("data-iddiv")).css("display", "block");
});
</script>
<script>
$(".col-md-2").on("click", function() {
$(".containerTickets").css("display", "none"); $("#" + $(this).attr("data-iddiv")).css("display", "block");
});
</script>
<script>
$(document).on('click', function (e) {
if ($(e.target).closest("#clubAuswahl").length === 0) {
$(".containerDays").hide();
}
});
</script>
<script>
$(document).on('click', function (e) {
if ($(e.target).closest(".containerDays").length === 0) {
$(".containerTickets").hide();
}
});
</script>

Answer

I hope this solves your problem. I will come up with the detailed explaination in sometime. For now enjoy and happy coding !

$(document).on('click','#clubAuswahl li',function(){
            var idToToggle = $(this).attr('data-iddiv');
            var self = this;
            $(self).closest('#clubAuswahl').find('li').each(function(){
            	var tempIdToHide = $(this).attr('data-iddiv');
            	if( this != self ){
            		$('#' +tempIdToHide).hide();
            	}
            })
        	$('#'+idToToggle).toggle();
        });

Comments