Trying to remove a class and add a class with jquery

Question

I am having issues trying to resize my iframe. I want to be able to add and remove a class so that it can get wider then smaller. I can't even get adding a class to work for some reason. Any suggestions?

 $(document).ready( $('#resize').onclick(function() { $('.frame_wrap').addclass('test'); }) ) 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <div id="preview_site"> <div class="preview_wrap"> <iframe class="frame_wrap" src="https://www.bdanzer.com"></iframe> </div> </div> <button id="resize">Button</button> 

http://jsfiddle.net/fesye0mu/3/

Answer 1

You need to pass a function to $(document).ready() .

addclass should be addClass , uppercase C .

onclick is just click in jQuery:

 $(document).ready(function() { $('#resize').click(function() { $('.frame_wrap').addClass('test'); }) }); 

 .test { border: 5px solid blue; } 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> <div id="preview_site"> <div class="preview_wrap"> <iframe class="frame_wrap" src="https://www.bdanzer.com"></iframe> </div> </div> <button id="resize">Button</button> 

Answer 2

There is not such function as onclick in jquery

It should be click(function(){}) or on('click', function(){}) . Also addclass should be addClass

Change to

$(document).ready(
  $('#resize').click(function() {
    $('.frame_wrap').addClass('test');
  })
)

Answer 3

您应该使用addClass（）而不是addclass，因为它区分大小写。