JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.1.0/css/bootstrap.min.css">
<div class="test">
		<a href="javascript:;">test one</a>
    <div class="content">demo contnet 1</div>
	</div>
	<div class="test">
		<a href="javascript:;">test two</a>
        <div class="content">demo content2</div>
	</div>
	<div class="test">
		<a href="javascript:;">test three</a>
        <div class="content">demo content3</div>
	</div>

CSS

.active {
			border:1px solid red;
		}
.content {
    display:none;
    border:1px solid red;
    padding:20px;
}
}

JavaScript

$(function(){
			$.myPlugin = {
				imgToggle : function(options){
					var defaults = {selector:'.test'};
					var options = $.extend(defaults,options);
                    var obj = this;
					$('a',options.selector).click(function(){
						if(this.className == 'active'){
                            $(this).animate({
                                marginLeft:0 + 'px'
                            });
							this.className = 'px';
                            $(this).next('.content').fadeOut();
						}else{
                            $(this).animate({
                                marginLeft:100 + 'px'
                            });
							this.className = 'active';
                            $(this).next('.content').fadeIn();
						}
					});
				}
			}
		})
		
		$(function(){
			$.myPlugin.imgToggle();
		});