An easy accordion without using a plugin, also includes a wp shortcode

accordion

// sweet accordion effect (using jQuery easing plugin)
$('.detail-title').click(function() {
		
	var $f = $(this),
	$content = $(this).next('.content');
		
	if(!$f.hasClass('menu-expanded')) {
		$f.addClass('menu-expanded');
		$content.stop().slideDown(666, 'easeInOutExpo');
	} else {
		$f.removeClass('menu-expanded');
		$content.stop().slideUp(666, 'easeInOutExpo');
	}
});	
	
// HTML (icons made with Fontawesome)
<div class="accordion">
	<h2 class="detail-title">Title<span class="plus-minus plus"><i class="fa fa-plus"></i></span><span class="plus-minus minus"><i class="fa fa-minus"></i></span></h2>
	<div class="content">Content</div>
</div>
	
// SCSS
.accordion {
	border-top: 1px solid #eaedf2;
	padding: 2em 0; 
	h2 {
		margin: 0;
		position: relative;
		text-transform: uppercase;
		@include transition(all .2s ease-in-out); 
		.minus {
			@include hp-opacity(0); 
		}
		.plus-minus {
			color: #df0e2c;
			font-size: 1em;
			position: absolute;
			top: 0;
			right: 5%;
			-webkit-font-smoothing: antialiased;
			@include transition(all .2s ease-in-out);  
		}
		&:hover {
			color: #df0e2c;
			cursor: pointer; 
		}
	}
	.menu-expanded {
		color: #df0e2c; 
		.minus {
			@include hp-opacity(1);
		}
		.plus {
			@include hp-opacity(0);
		}
	}
	.text {
		display: none;
		padding: 1em 0; 
		p {
			margin: 1em 0; 
		}
	}
}


// Wordpress Shortcode
remove_filter( 'the_content', 'wpautop' );
add_filter( 'the_content', 'wpautop' , 12);

function accordion($atts, $content = null) {
	$content = wpautop(trim($content));
    extract(shortcode_atts(array(
        "title" => ''
    ), $atts));
    
    return '<div class="accordion"><h2 class="detail-title">'.$title.'<span class="plus-minus plus"><i class="fa fa-plus"></i></span><span class="plus-minus minus"><i class="fa fa-minus"></i></span></h2><div class="content">'. do_shortcode($content) .'</div></div>';
}

add_shortcode("accordion", "accordion");