Change text of anchor - Expand/Retract all using .toggle jQuery
<p>I am using .toggle to expand/retract individual divs with the click of an anchor and also have one anchor that will expand/retract all of the divs. When clicking the individual anchor the anchor text changes from a "+" to a "-". Currently when you click the expand/retract all anchor the individual anchor text does not change - I would like them to change from "+" to "-" when the expand/retract all anchor is clicked. Below is my code - all is working except for the changing of the anchor text on the expand all:</p>

<p>HTML:    </p>

<pre><code>&lt;a class="expand-all" href="#"&gt;+ Expand All&lt;/a&gt;

&lt;a class="toggle toggle-engine" href="#"&gt;+&lt;/a&gt;
&lt;div class="expand specs-engine"&gt;&lt;/div&gt;

&lt;a class="toggle toggle-body" href="#"&gt;+&lt;/a&gt;
&lt;div class="expand specs-engine"&gt;&lt;/div&gt;
</code></pre>

<p>JS:</p>

<pre><code>$('.expand').click(function() {$(this).toggle(400);});
$('.expand-all').click(function() {
  if ($(this).text() == '+ Expand All')
    $('.expand').show(400).find('.toggle').text('-');
  else
    $('.expand').hide(400).find('.toggle').text('+');
  $(this).text($(this).text() == '+ Expand All' ? '- Retract All' : '+ Expand All');
});


$('.toggle-engine').click(function() {
    $('.specs-engine').toggle(400);
$(this).text($(this).text() == '+' ? '-' : '+');
return false;
}); 
</code></pre>
