jQuery accordions and Wordpress Shortcode

I'm trying to get a jQuery accordion/tab Shortcode to look like this

[accordions]
[accordion title="Accordion 1"]Accordion 1 Content[/accordion]
[accordion title="Accordion 2"]Accordion 2 Content[/accordion]
[accordion title="Accordion 3"]Accordion 3 Content[/ac开发者_如何转开发cordion]
[/accordions]

I've tried many ways but I just cant seem to get it to work

How can this be done?

---

I haven't tested this code, but this should work:

function accordian_open_tag( $atts, $content='' ) {
  return '<div class="accordion">{$content}</div>';
}
function accordian_section( $atts, $content='' ) {
  $atts = shortcode_atts( array(
    'title' => 'default title'
  ), $atts );

  return "<h3><a href=\"#\">{$atts['title']}</a></h3>" . 
         "<div>{$content}</div>";
}
add_shortcode( 'accordians', 'accordian_open_tag' );
add_shortcode( 'accordian', 'accordian_section' );

You will need to run $(".accordian").accordian() when the page is loaded for this to work.

---

<?php
// my shortcode like 
/*
[accordion] 
    [section title="Your title #1" class="active" ] 
    Your Description here #1
    [/section]
    [section title="Your title #2"]
    Your Description here #2
    [/section]
    [section title="Your title #3"]
    Your Description here #3
    [/section]
[/accordion]  
*/
add_shortcode( 'section', 'section' );
function section( $atts, $content ){
     extract(shortcode_atts(array(
        'title' => 'Collapse',
        'id'    => false,
        'class' => false,
    ), $atts));
    $GLOBALS['section'][] = array( 
        'title'   =>  $title ,
        'id'      =>  $id,
        'class'   =>  $class ,
        'content' =>  $content ,
    );
    $id  = "collapse-id-".$GLOBALS['collapsibles_count'];
    foreach( $GLOBALS['section'] as $tab ){         
        $class = ( !empty($tab['class']) && $tab['class']=="active" ) ? "panel-collapse collapse in"  : "panel-collapse collapse";      
        $__title = preg_replace('/[^a-zA-Z0-9._\-]/', '', strtolower($tab['title'])  );     
        $return = sprintf( "\n".'<div class="panel panel-default"><div class="panel-heading"><h4 class="panel-title"><a data-toggle="collapse" data-parent="#%s" href="#%s">%s</a></h4></div><div id="%s" class="%s"><div class="panel-body">%s</div></div></div>'."\n",$id, $__title, $tab['title'], $__title, $class, $tab['content']);       
    } // foreach        
    return do_shortcode($return);
}// function ending
add_shortcode( 'accordion', 'accordion' );
function accordion( $atts, $content ){ 
    if(isset( $GLOBALS['collapsibles_count'] )) {
        $GLOBALS['collapsibles_count']++;
    }else {
        $GLOBALS['collapsibles_count'] = 0; 
    }
    $id  = "collapse-id-".$GLOBALS['collapsibles_count'];
    return  do_shortcode(sprintf('<div class="tp-accordion"><div class="panel-group" id="%s"> %s </div></div> ', $id, $content));
}
?>

wordpressshortcodebootstrap