Back to Tutorial Paste Your Code here! <!DOCTYPE html> <html> <head> <title>jQuery FadeToggle Effect Method </title> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script> <script> $(document).ready(function(){ $("button").click(function(){ $("#demo1").fadeToggle(); $("#demo2").fadeToggle("slow"); $("#demo3").fadeToggle(1000); $("#demo4").fadeToggle(2000); }); }); </script> </head> <body> <button>Click Here</button><br> <div id="demo1" style="width: 100px; height: 100px; background-color: pink;" ></div> <div id="demo2" style="width: 100px; height: 100px; background-color: orange;" ></div> <div id="demo3" style="width: 100px; height: 100px; background-color: blue;" ></div> <div id="demo4" style="width: 100px; height: 100px; background-color: red;" ></div> </body> </html> Output