4Jean 4Jean - 4 months ago 24
HTML Question

show / hide link with jquery

I want to hide link with jquery, if the user clicks button first time, link will hide(by adding class hidden), but should show if clicks button second time (remove class hidden). its a collapse-toggle feature.
When I click button first time, it hides, but second time, does not work

HTML

<!--BUTTON -->
<div class="sidebar-collapse" style="" id="sidebar-collapse">
<a href="#" class="sidebar-collapse-icon with-animation">

<i class="entypo-menu"></i>
</a>
</div>
<a href="mysite_url" id="logo-title"> <br> My Site Name </a>


JAVASCRIPT

<script>
var logo_title = $('a#logo-title');
$('div#sidebar-collapse').click(function(){
logo_title.addClass('hidden-md hidden-lg cj_inspired');
if($('div#sidebar-collapse').click() && logo_title.hasClass('cj_inspired') ){
$('a#logo-title').removeClass('hidden-md hidden-lg cj_inspired');
}
})
</script>

Answer

You can hide show link like this:

$('div#sidebar-collapse').click(function(){
  if ( $("#logo-title").is(":visible") ) { 
    $("#logo-title").hide(); 
  } else if ( $("#logo-title").is(":hidden") ) { 
    $("#logo-title").show(); 
  }
})
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<div class="sidebar-collapse" style="" id="sidebar-collapse">
     <a href="#" class="sidebar-collapse-icon with-animation">
         Click               
         <i class="entypo-menu"></i>
     </a>
 </div>
 <a href="mysite_url" id="logo-title"> <br> My Site Name </a>

Comments