Problem with jQuery addclass and RemoveClass

0

Speak up, I'm having trouble using addClass and Remove Class in jQuery. I need the class="lala" section to click on it, it will disappear and appear at class="video" . I need the class "video" to occupy the same space as the class "lala" .ps: (a class "video" can not appear in the html until clicked) JSFiddle: link THANKS

asked by anonymous 25.09.2018 / 19:01

1 answer

0

I do not know if it might be the best option, but since you want the class to go away and not be hidden, try saving them to a variable and just working with both.

  • Save var lalaHtml = $ ('.lala'). html () var videoHtml = $ ('.video'). html ()

  • Add $ ('.lala'). html (lalaHtml) $ ('.lala'). html (videoHtml)

You have other better ways to do this.

var lalaHtml = $('.lala').html();
var videoHtml = $('.video').html();

$(function() {
  $(document).on('click', '.lala', function () { 
   $('.lala').html('');
   $('.video').html(videoHtml);
   console.log('lala')
  });
});

$(function() {
  $(document).on('click', '.video', function () { 
   $('.video').html('');
   $('.lala').html(lalaHtml);
   console.log('video')
  });
});
.media3{
  width:57%;
  display: inline-block;
  vertical-align: top;
  padding-left: 60px;
  padding-top:50px;
}
.media3 h2{
  font-size: 16px; 
  color: red; 
  font-weight: bold;
  padding-bottom:20px;
}
.media3 p{
  color: rgb(112, 111, 111); 
  font-size: 16px; 
  font-weight: bold;
  padding-bottom: 20px;
}
.media3 strong{
  font-size:17px;
  font-weight: bold;
}
.media4{
  color:#FF0000;
  font-size:12px;
}

.video.for {
  display:block;
}
   
 <script src="https://code.jquery.com/jquery-3.2.1.min.js"></script><sectionclass="lala">
  <div class="media3">
    <h2>title for the things we shuld do</h2>
    <p>
      &quot;Pusing Lorem Ipsum is that it has a more-or-less normal distribution            of letters, as opposed to using 'Content here, content here'
      <strong style=""> &quotwe serve to wudwhq&quot;.&quot;</strong>
      &nbsp;
    </p>
    <h3 class="media4" >-GRAG THE PRESIDENT OF THE USA</h3>
  </div>
</section>
<div class="video">
    <img src="https://as2.ftcdn.net/jpg/00/00/57/35/500_F_573556_fGmwktYr1XKdRjt3iNgydn5kuiNfpc.jpg">
</div>

Dai is only to hide the first div that you do not want to appear first

    
27.09.2018 / 20:42