Html
copy
reset
Run
Netbax Online Editor Try it Yourself
<button id="fade">Click to fade</button> <span class="fade1" style="display:none;">Contrary to popular belief, Lorem Ipsum. Interagi no mé, cursus quis, vehicula ac nisi.</span> <span class="fade2" style="display:none;">Contrary to popular belief, Lorem Ipsum. Interagi no mé, cursus quis, vehicula ac nisi.</span> <span class="fade3" style="display:none;">Contrary to popular belief, Lorem Ipsum. Interagi no mé, cursus quis, vehicula ac nisi.</span> <script src="https://code.jquery.com/jquery-3.4.1.min.js"></script> <script> $(document).ready(function(){ $("#fade").click(function(){ $(".fade1").fadeIn("slow"); $(".fade2").fadeIn("fast"); $(".fade3").fadeIn(1500); }); }); </script>
