trouble implementing twitter bootstrap accordion

Question

I am having trouble implementing twitter bootstrap's accordion feature and wondered if someone could take a look and point out why it isn't working:

<div class="accordion">
            <div class="accordion-group" style="display:none" id="View" data-bind="foreach:Types">
                <div class="accordion-heading">
                    <div class="text_x-large header"><span data-bind="text:Name()"></span> 
                        <span class="icon-plus-sign-alt accordion-toggle"></span>
                    </div>
                </div>
                <div class="accordion-body collapse in" data-bind="template: { name: 'list', foreach: $data.Users }"></div>
            </div>
        </div>

the last div calls the following to be placed within the div with class collapse:

<script type="text/html" id="list">
    <div class="accordion-inner">
        <h3 id="letter" data-bind="text: Letter"></h3>
        <div class="smoke_hover" >
            <div class="list_item">
                <span class="h2"><small data-bind="text: Name"></small></span>
            </div>
        </div>
    </div>
</script>

Answer 1

I rearranged your setup to be more like the collapse example from the bootstrap docs and it worked like a charm

Here is the fiddle: http://jsfiddle.net/Jgdmq/