{"id":4421,"date":"2026-04-10T11:55:28","date_gmt":"2026-04-10T10:55:28","guid":{"rendered":"https:\/\/ibex.tech\/javascript\/?p=4421"},"modified":"2026-04-10T11:58:10","modified_gmt":"2026-04-10T10:58:10","slug":"toggle-containers-visible-or-not","status":"publish","type":"post","link":"https:\/\/ibex.tech\/javascript\/manipulating-html\/toggle-containers-visible-or-not","title":{"rendered":"Toggle containers visible or not"},"content":{"rendered":"\n<h4 class=\"wp-block-heading\">Using a class name for all the containers you want to toggle<\/h4>\n\n\n\n<p>(flex friendly)<\/p>\n\n\n\n<h5 class=\"wp-block-heading\">CSS<\/h5>\n\n\n\n<pre class=\"wp-block-code\"><code>.hidden\n{\n  display: none;\n}<\/code><\/pre>\n\n\n\n<h5 class=\"wp-block-heading\">Javascript<\/h5>\n\n\n\n<pre class=\"wp-block-code\"><code>const elements = document.querySelectorAll('.MyToggleTarget');\n\nelements.forEach(element =>\n{\n  element.classList.toggle('hidden');\n});<\/code><\/pre>\n\n\n\n<h5 class=\"wp-block-heading\">HTML<\/h5>\n\n\n\n<pre class=\"wp-block-code\"><code>&lt;div class=\"MyToggleTarget\">&lt;\/div>\n&lt;div class=\"MyToggleTarget\">&lt;\/div>\n\n\/\/Or you can start off hidden\n&lt;div class=\"MyToggleTarget hidden\">&lt;\/div><\/code><\/pre>\n","protected":false},"excerpt":{"rendered":"<p>Using a class name for all the containers you want to toggle (flex friendly) CSS Javascript HTML<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[132,74],"tags":[],"class_list":["post-4421","post","type-post","status-publish","format-standard","hentry","category-manipulating-css","category-manipulating-html"],"_links":{"self":[{"href":"https:\/\/ibex.tech\/javascript\/wp-json\/wp\/v2\/posts\/4421","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/ibex.tech\/javascript\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/ibex.tech\/javascript\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/ibex.tech\/javascript\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/ibex.tech\/javascript\/wp-json\/wp\/v2\/comments?post=4421"}],"version-history":[{"count":3,"href":"https:\/\/ibex.tech\/javascript\/wp-json\/wp\/v2\/posts\/4421\/revisions"}],"predecessor-version":[{"id":4424,"href":"https:\/\/ibex.tech\/javascript\/wp-json\/wp\/v2\/posts\/4421\/revisions\/4424"}],"wp:attachment":[{"href":"https:\/\/ibex.tech\/javascript\/wp-json\/wp\/v2\/media?parent=4421"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/ibex.tech\/javascript\/wp-json\/wp\/v2\/categories?post=4421"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/ibex.tech\/javascript\/wp-json\/wp\/v2\/tags?post=4421"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}