はてなブログの方で続けているjQueryの実験の続きです。
http://niming538.hatenablog.com/entry/2014/03/05/184705
ボタンを押すと、「ほれほれ」という行が追加されていって、追加された「ほれほれ」をクリックすると、追加された行が消える。
あちこち参考にとりあえず動きましたが、一行ずつ消えずに一度に消えてしまうのが気に入りません。
<div id="place"> </div> <p><button id="add">Add!</button></p> <script type="text/javascript" src="http://code.jquery.com/jquery-1.11.0.min.js"></script> <script type="text/javascript">// <![CDATA[ $(function() { $('#add').click(function() { var p = $('<p>').text('ほれほれ').addClass('addClick'); $('#place').append(p); }); $('#place').on("click", { class : "addClick" }, function() { $('.addClick').remove(); }); }); // ]]></script>
ちなみに、
// <![CDATA[
と
// ]]>
は、はてなブログのHTML編集が勝手に入れる、入れてくれるものです。
念の為、ということでしょうか。