title: Changing Accordion title on expand/collapse changing more than one span
body: <p>I am trying to get an text in an accordion title to change when it is expanded and collapsed.
  It works except when I have another accordion inside then it changes both on collapse. 
  <a href="http://jsfiddle.net/mwvuH/3/" rel="nofollow">http://jsfiddle.net/mwvuH/3/</a></p>
  
  <pre><code>$(document).ready(function() {
    $(".accordion-body").on("show",function(event){
      $('span', $(this).prev()).text('-');
    });
    $(".accordion-body").on("hide",function(event){
      $('span', $(this)).text('+');
    });
  });
  </code></pre>
  
  <p>HTML</p>
  
  <pre><code>&lt;div class="accordion-heading"&gt;
      &lt;div class="accordion-toggle" data-toggle="collapse" href="#collapseFive"&gt;
          Title
          &lt;a href="#collapseFive"&gt;&lt;span class="pull-right"&gt;+&lt;/span&gt;&lt;/a&gt;
      &lt;/div&gt;
    &lt;/div&gt;
    &lt;div id="collapseFive" class="accordion-body collapse out"&gt;
      &lt;div class="accordion-inner"&gt;
        Inside
        &lt;div class="accordion-heading"&gt;
          &lt;div class="accordion-toggle" data-toggle="collapse" href="#collapseSix"&gt;
              Inside Title
              &lt;a href="#collapseSix"&gt;&lt;span class="pull-right"&gt;+&lt;/span&gt;&lt;/a&gt;
          &lt;/div&gt;
        &lt;/div&gt;
        &lt;div id="collapseSix" class="accordion-body collapse out"&gt;
          &lt;div class="accordion-inner"&gt;
              Inside Inside
          &lt;/div&gt;
        &lt;/div&gt;
      &lt;/div&gt;
    &lt;/div&gt;
  </code></pre>