JSFiddle - React, Tailwind, and code Playground

HTML

<div class="toggler" href="#">Toggler</div>
        <div class="accordion">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi interdum suscipit risus, dapibus pharetra nulla vestibulum sed. Nam bibendum dictum volutpat. Aenean nec purus vitae sapien rutrum sollicitudin. Praesent et urna sed velit convallis placerat. Maecenas porttitor, mauris tincidunt tempor vehicula, dui turpis ornare mi, sed volutpat felis risus eu orci. Nulla vel neque metus, tempus interdum nunc</div>
  <div class="toggler" href="#">Toggler</div>
        <div class="accordion">Lorem  ipsum dolor sit amet, consectetur adipiscing elit. Morbi interdum  suscipit risus, dapibus pharetra nulla vestibulum sed. Nam bibendum  dictum volutpat. Aenean nec purus vitae sapien rutrum sollicitudin.  Praesent et urna sed velit convallis placerat. Maecenas porttitor,  mauris tincidunt tempor vehicula, dui turpis ornare mi, sed volutpat  felis risus eu orci. Nulla vel neque metus, tempus interdum nunc</div>

CSS

.toggler{
    font-weight:bold;
    color:#C7BE71;
    background:transparent url(../img/plus.gif) left center no-repeat;
    border-bottom:1px #D9DABB solid;
    padding-left:15px;
    margin-top:7px;
    cursor:pointer;
    cursor:hand;
}
.toggler.active {
    background:transparent url(../img/minus.gif) left center no-repeat;
    height:60px;
}

JavaScript

window.addEvent('domready',function()
{
    var accordionTogglers = $$('div.toggler'),
    accordionElements = $$('div.accordion'),
    slideTogglers = $$('a.v_toggle'),
    slideElements = $$('div.vertical_slide'),
    myAccordion = new Accordion(accordionTogglers, accordionElements, {
        display:-1,
        alwaysHide : true, //alwaysHide : true  + display : -1 = win
        onActive: function(toggler, element){
            toggler.setStyle('color', '#6B6C63');
            toggler.setStyle('background-image', 'url(<?php bloginfo('template_directory'); ?>/style/images/btn-minus.png)');
            toggler.setStyle('background-position', '458px center');
            toggler.setStyle('background-repeat', 'no-repeat');
        },
        onBackground: function(toggler, element){
            toggler.setStyle('color', '#505146');
            toggler.setStyle('background-image', 'url(<?php bloginfo('template_directory'); ?>/style/images/btn-plus.png)');
            toggler.setStyle('background-position', '458px center');
            toggler.setStyle('background-repeat', 'no-repeat');
        }
    });
 
  //initialize slideElement slide properties and hide them
    slideElements.set('slide',
    {
        duration: 300,
        onComplete : function()
        {
            myAccordion.display(0);
        }
    }).slide('hide');
 
    slideTogglers.addEvent('click',function(e)
    {
        e.stop();
        var slideIndex = slideTogglers.indexOf(this),
        accordionIndex = accordionElements.indexOf(this.getParent('div.element'));
 
        slideElements[slideIndex].slide('toggle');
    });
});