4Jean 4Jean - 1 year ago 84
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 Source

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>