title: Making a click event only affect child of parent class?
body: <p>I am trying to create an expandable list of search filters for my site. Where each category has subcategories. I am using Bootstrap so I opt'd to use a customized version of the BS accordion. I have it so when you click a "parent" category the font awesome "plus" icon beside the parent turns into a "minus" to show collapsing thew list as the next action (as normally seen).</p>
  
  <p><strong>For example:</strong></p>
  
  <pre><code>+Computers
  
  +Phones
  
  -Tablets
  
     Android Tablets
  
     Windows Tablets
  
     Apple iPads
  </code></pre>
  
  <p>The problem is, if you click Tablets to expand it as shown in my example above then click it again to collapse the list of tablets, it will toggle all of the icons for every other parent accordion list with an active plus icon to the minus even though they're collapsed.</p>
  
  <p><strong>Here's my jquery:</strong></p>
  
  <pre><code>$('.categories').click(function(){
  var collapsed=$(this).find('i').hasClass('fa-plus-square-o');
  
  $('.categories').find('i').removeClass('fa-minus-square-o');
  
  $('.categories').find('i').addClass('fa-plus-square-o');
  if(collapsed)
      $(this).find('i').toggleClass('fa-plus-square-o fa-minus-square-o')
  });
  </code></pre>
  
  <p>I feel like there has to be a better solution available than how I am trying to make it happen. Can I write jquery to only impact the element actually being clicked without having to use tons of ID's and excessive jquery to account for each ID? I feel like a new ID for each list could get pretty messy as we may have 30+ expandable lists, not to mention the potential that there could be a child list of a child in the main list (trying to account for any possibility and make it scalable as these categories will be dynamic and not hard-coded) like so:</p>
  
  <pre><code>-Tablets
  
    -Android Tablets
  
      +Asus Tablets
  
      +Nvidia Tablets
  
      -Nexus Tablets
  
          Nexus 7"
  
          Nexus 10"
  
      +HTC Tablets
  </code></pre>