I know there are several questions/solutions to this problem, and I am looking for a combination of two simple solutions(I am not a coder, just a copy/paste/manipulator) so here goes: I need a script which involves a button that toggles show/hide divs on top of a large imagemap, whose function is to turn on/off labels contained within each div. As the imagemap is large and contains groups, I am looking for a way to loop the following functional script:

```
  $(document).ready(function() {
  $(".hide").click(function() {
    $(this).siblings(".hideShow").hide();
  });
  $(".show").click(function() {
    $(this).siblings(".hideShow").show();
  });
  });

```

The loop is needed as I will have well over 200 labels to toggle(removing them will clear some visual space). The html above lists two buttons, whereas I need only one which toggles between the two, like the one behind this jquery bit:

```
  var toggleState = false;
$('.show').click(function() {
$(".text").toggle();
$(this).toggleClass('hide').attr('title', toggleState ? 'Show All' : 'Hide All');
toggleState = !toggleState;
})

```

The former jfiddle found here: <http://jsfiddle.net/MztAm/>
The latter here: <http://jsfiddle.net/y8ZTj/1/>

Actually, as the latter script is more desireable, is it possible to turn it into a loop, replacing ".text" to accomodate many instances?

The best I could come up with: <http://jsfiddle.net/qmv3dmya/> though I need a new instant of the jquery piece for every grouping. But I'll end up putting the series in a separate \*.js sheet to be referenced by the main page.