Para fazer as trocas de classes que pretende pode utilizar a função removeClass
para remover a classe antiga e a função addClass
para adicionar a nova.
Algo como:
$("#hide").click(function() {
$("#content").hide();
$("#content1").removeClass("col-lg-6").addClass("col-lg-12");
});
$("#hide1").click(function() {
$("#content1").hide();
$("#content").removeClass("col-lg-6").addClass("col-lg-12");
});
.col-lg-6 {
background-color: green;
}
.col-lg-12 {
background-color: red;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="row">
<div class="col-lg-6" id="content">
<button id="hide"><i class="fa fa-minus"></i></button> tabela
</div>
<div class="col-lg-6" id="content1">
<button id="hide1"><i class="fa fa-minus"></i></button> panel
</div>
</div>
Tirando proveito da hierarquia no html
De acordo com o html indicado (se for diferente poderá não ser a melhor opção) pode simplificar os clicks utilizando parent
e siblings
com:
$("#hide, #hide1").click(function(){
$(this).parent().hide().siblings().removeClass("col-lg-6").addClass("col-lg-12");
});
O parent
navega do botão hide
até ao <div>
que é o que quer esconder, dai o hide
. Depois com siblings
apanha o <div>
ao lado e faz a troca de classes.
Repare também que agrupei as duas funções de click
numa só uma vez que a navegação é feita através da hierarquia de elementos e por isso não depende especificamente de um id ou classe.
Exemplo a funcionar:
$("#hide, #hide1").click(function() {
$(this).parent().hide().siblings().removeClass("col-lg-6").addClass("col-lg-12");
});
.col-lg-6 {
background-color: green;
}
.col-lg-12 {
background-color: red;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="row">
<div class="col-lg-6" id="content">
<button id="hide"><i class="fa fa-minus"></i></button> tabela
</div>
<div class="col-lg-6" id="content1">
<button id="hide1"><i class="fa fa-minus"></i></button> panel
</div>
</div>
Documentação:
col-lg-6
e adicionar acol-lg-12
com as funçõesremoveClass
eaddClass
?