Segue demonstração do que estou tentando fazer..
HTML
<div id="conteudo">
<div id="inner" class="move">
<div class="col-md-10"><a class="botao" href="#">botao</a></div>
<div class="col-md-2">22222</div>
</div>
</div>
JS
$( ".botao" ).click(function( {
$( "#inner" ).addClass( "move-left" );
});
);
CSS
#conteudo{overflow:hidden;width:100%;position;relative;height:200px;}
#inner{height:200px;width:120%;}
.move{left:0;position:relative;}
.move-left{left:-20%;position:relative;background:#000!important}
.col-md-10{width:80%;position:relative;float:left;}
.col-md-2{width:20%;position:relative;float:left;}
.botao{width:100px;height:100px;}
http://jsfiddle.net/35DJy/387/
quero que quando clicar no botado o conteudo do col-md-2
venha para esquerda, e quando clicado fora desse elemento, retire a classe move-left