¿Cómo puedo usar .append() con efectos como .show('slow')
Tener efectos en agregar no parece funcionar en absoluto, y da el mismo resultado que el show normal (). Sin transiciones, sin animaciones.
$(function () { var html = "<div id='str'>Hello</div>"; $('#btn').click(function () { $('#cont').append(html); }); }); <button id='btn'>click</button> <div id='cont'></div> <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>prueba esto:
$(function () { $('#str').hide(); var html = ""; $('#btn').click(function () { $('#str').toggle(1000); }); }); <button id='btn'>click</button> <div id='cont'></div> <div style="display:none" id='str'>Hello</div> <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>Si realmente está desesperado por agregar HTML
$(function () { $('#str').hide(); var html = ""; $('#btn').click(function () { $('str').innerHTML ="Hello" $('#str').toggle(1000); if($('str').style.display=="none"){ $('str').innerHTML ="" } }); }); <button id='btn'>click</button> <div id='cont'></div> <div style="display:none" id='str'></div> <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>