Question

Having trouble getting to this span tag to add and remove HTML content for the toggle arrow.

$('h3 + p').hide();

$('h3').click(
function() {
$(this).next().slideToggle('normal');
 });

if ($('p').css('display') == 'none') {
      $(this).closest("span").html('&#9658');
 }
 else {
      $(this).closest("span").html('&#9660');
 } 


<h3><span></span> TITLE</h3>
<p> this content will toggle</p>

Answer 1

Here’s a modification to your code, which is I think what you want:

http://jsfiddle.net/qXSnC/1/

$('h3').click(function() {
    $(this).next().stop().slideToggle('normal').toggleClass("hidden");

    if (!$('p').hasClass('hidden')) {
          $(this).find("span").html('&#9658');

     }
     else {
          $(this).find("span").html('&#9660');
     } 

 });