new Behavior().apply(document.body);
new Delegator().attach(document.body);

<div data-behavior="Accordion" data-accordion-options="
    'headers': '.toggle',
    'sections': '.target'
">
  <div class="toggle">Toggle 1</div>
  <div class="target">This area is controlled by Toggle 1.</div>
  <div class="toggle">Toggle 2</div>
  <div class="target">This area is controlled by Toggle 2.</div>
  <div class="toggle">Toggle 3</div>
  <div class="target">This area is controlled by Toggle 3.</div>
</div>

<hr/>
<div id="box">
    <p>
        <a data-trigger="toggleClass" data-toggleclass-options="
            'target': '!div#box',
            'class': 'red'
        ">Click to toggle this color to red and back.</a>
    </p>
</div>

.red {
    background: #DE3535;
}
a {
    display: block;
    cursor: pointer;
}
.toggle {
    cursor:pointer;
    background: #777;
    padding: 2px;
}
.target {
    padding: 4px;
}
[data-behavior=Accordion] {
    width: 300px;
    margin: 10px;
}
#box {
    border: 1px solid #000;
    margin: 10px;
    text-align: center;
    display:inline-block;
}
[data-trigger=toggleClass] {
    width: 100px;
    padding: 40px;
}

jsFiddle