Load content from one div into another div

2

I have the following problem. How do I load content from a div to another div empty that is in the same HTML file?

Example:

<div class="conteudo">
   <label> Teste 1 </label>
   <label> Teste 1 </label>
</div>
<div class="receber conteudo">

</div>

I wanted to throw all this content from the first div into the second div empty through a jQuery function, I already tried the find method but without success.

    
asked by anonymous 19.08.2016 / 16:23

1 answer

4

In your example, the two divs contained the .conteudo class.

In order to avoid class name conflict, I changed the class name in the div that receives the content: from receber conteudo to receber_conteudo .

See the example below:

//
// JAVASCRIPT
//

$('#btnMoverConteudo').click(function(){
  // copia o conteúdo em .receber_conteudo
  $('.receber_conteudo').append($('.conteudo').html()); 
  // limpa o valor de conteúdo
  $('.conteudo').html(''); 
});
//
// CSS
//

.receber_conteudo{
    border:1px solid red;
    padding:15px;
 }

.conteudo{
    border:1px solid black;
    padding:15px;
 }
//
// HTML
//

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script><divclass="conteudo">
   <label> Teste 1 </label>
   <label> Teste 1 </label>
</div>
<div class="receber_conteudo">

</div>
<input type="button" id="btnMoverConteudo" value="Mover"/>
    
19.08.2016 / 16:50