javascript - Twitter ブートストラップ: ボタンのクリック時に span12 で展開します

Question

プロジェクトにブートストラップを使用しています。

これは、レイアウトを設計するために私が従っている構造です-

<div class="row-fluid">
<div class="expand-this">
<div class="span8">
<div class="row-fluid">
<div class="span6 pull-left">
<b>Display Name</b>
</div>
<div class="span6 pull-right">
<input type="text"/>
</div>
</div>
</div>
</div>
<div class="hide-accordion">
<div class="span4">
<div class="block">
...some information..
</div>
</div>
</div>
<button class="button-hiding"></button>

ここでは、2 つのブロックを 1 行に並べていることがわかります。での 2 番目のスパンは動的な値を取りますrow-fluid。span4だから私はボタンでそれを隠そうとしています。

jQuery -

$('.hide-accordion').hide();
$(function () {
    $('.button-hiding').click(function () {
        $('.hide-accordion').toggle(this);
    });
});

これはうまくいっているものです。ウィンドウの読み込み時にこのアコーディオンを非表示にしています。

私が欲しいもの -

アコーディオンが非表示のときにspan8が全幅になりspan12、ボタンをクリックするとすぐにアコーディオンが表示されます。span8その後、元の幅を取る必要があります。

私もjQueryでこれを試しました-

$('.hide-accordion').hide();
$(function () {
    $('.button-hiding').click(function () {
        $('.hide-accordion').toggle(this);
        $('.Expand-this>div .span8').removeClass('span8');
        $(this).addClass('span12');
    });
});

しかし、運が悪い、助けて？