Estoy intentando hacer más/menos expandir/colapsar. En la versión móvil funciona bien, pero en la vista de escritorio intentaré ocultarlo, pero no funciona; display: none no funciona.
Cuando hago clic en la versión de escritorio que muestra el signo más/menos, también necesito ocultarme del escritorio.
jQuery(document).ready(function() { var windowWidth = jQuery(window).width(); if (windowWidth <= 768) jQuery('.panel-collapse').removeClass('in'); $(this).closest(".day-header").find(".plus,.minus").toggle(); jQuery('.toggle-menu').click(function() { // get this data-target var target = $(this).data("target"); $(target).toggleClass('in'); $(this).closest(".day-header").find(".plus,.minus").toggle(); }); $(".minus,.plus").click(function() { $(this).hide(); }); }); .toggle-menu { cursor: pointer; } .col .collapse.in { display: block; } .col .collapse { display: none; } <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <div class="col"> <div class="day-header"> <h4> <span class='plus' style='display:none;'>+</span> <span class='minus'>-</span> <a class="toggle-menu" data-target="#foot">Footwere</a> </h4> </div> <div id="foot" class="panel-collapse collapse in"> <p> Show footwere </p> </div> </div> <div class="col"> <div class="day-header"> <h4><a class="toggle-menu" data-target="#cloth">cloths</a></h4> </div> <div id="cloth" class="panel-collapse collapse in"> <p> Show cloth </p> </div> </div>