使用jquery为div加上前缀+和-

div.Syb> div:before
{
    content: '+';
}
div.Syb> div.hidden:before
{
    content: '-';
}

那就简单地用 toggleClass() 给你的女主角一个隐藏的职业。

如果您想在直接的jQuery中执行此操作,您可能需要稍微更改标记:

<div class="Syb">
    <h4><span>+</span>Title One</h4>
    <div id="one">Text</div>
    <h4><span>+</span>Title Two</h4>
    <div id="two">Text</div>
    <h4><span>+</span>Title Three</h4>
    <div id="three">Text</div>
</div>

<script type='text/javascript'>
$(document).ready(function() {
    $('div.Syb> div').hide();
    $('div.Syb> h4').click(function() {
       var span = $(this).children('span:first');
       span.text(span.text()=='+'?'-':'+');
        $(this).next('div').slideToggle('fast')
            .siblings('div:visible').slideUp('fast');
    });
});
</script>