Q:

jquery hide div's click function, then bring back when clicking same link

I am using the following script to do the following:

When clicking a.navbar-toggle.search it drops down & shows the .search-wrapper div
When it shows the .search-wrapper div, it also add's a class (hide) to the following divs to hide them:

.strapline-top / .container.inner / .gallery/ .boxes
The above is all fine & working well.
After clicking the link it changes it to:
<a href="#" class="navbar-toggle search show">

Question:
What I need now is to show/bring back the above divs (in point 2) when the following div is clicked:
<a href="#" class="navbar-toggle search show">

jQuery script being used:
<script type="text/javascript">
  $(function ($) {
    var search_wrapper = $('.search-wrapper');
     $('a.navbar-toggle.search').click(function () {
        $(this).toggleClass('show');
        $('.strapline-top').addClass('hide');
        $('.container.inner').addClass('hide');
        $('.gallery').addClass('hide');
        $('.boxes').addClass('hide');
        search_wrapper.slideToggle(400);
        if ( $(this).hasClass('show') ) {
            $('a.navbar-toggle.user').removeClass('show'); // mark the other as hidden
            mywinkworth_wrapper.slideUp(400); // hide the other one
        }
        return false;
    });
  });
</script>

What is the easiest way to achieve this?
JSFiddle Here

A:

Hope this is what u need mate.. :)
$(function ($) {
    var search_wrapper = $('.search-wrapper');
     $('a.navbar-toggle.search').click(function () {
        $('.strapline-top,.container.inner,.gallery,.boxes').toggle();
        search_wrapper.slideToggle(400);
         if ( $(this).is(':visible') ) {
            $('a.navbar-toggle.user').toggle();; // this is changing another div's class - mark the other as hidden
            mywinkworth_wrapper.slideUp(400); // for the above - hide the other one
        }
        return false;
    });
  });

Fiddle
FYI
toggle
is()

