動的に追加した要素からの追加した自身の要素の削除[jQuery]

修正前のJS

$("#animate").click(function(){
$(this).before("<div class=’inbox’><input name=’works_url[]‘ class=’works_url’ size=’30′ value=” /><span class=’deth’>◆</span></div>");
});
$("span.deth").click(function(){
$(this).closest(‘div’).remove(‘.inbox’);
});

});

修正後のJS等

<html>
<head>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script type="text/javascript">
<!–
$(function() {

$("#animate").click(function(){
$(this).before("<div class=’inbox’><input name=’works_url[]‘ class=’works_url’ size=’30′ value=” /><span class=’deth’ onclick=’javascript:app();’>◆</span></div>");
});

});

function app() {
$("span.deth").click(function(){
$(this).closest(‘div’).remove(‘.inbox’);
});
}
// –>
</script>
</head>
<body>

<div class=’inbox’><input name=’works_url[]‘ class=’works_url’ size=’30′ value=” /><span class=’deth’ onclick=’javascript:app();’>◆</span></div>
<span id="animate">on</span>

</body>
</html>

追加した要素からの.click();は認識してくれない模様。
onclickにてイベントを呼び出してから.clickのイベントを実行する。

なるほど。。。。

けど、onclickはなんとなく好きじゃないからどうにかできたらいいのになぁ。。。

スライドする箇所をうにゃうにゃ

$('#menu li').click(function() {
var title = $(this).attr("class");
    if($("."+title).next('.accordion_in').is(':visible')) {
        $("."+title).next('.accordion_in').slideUp(300);
    } else {
        $("."+title).next('.accordion_in').slideDown(300).siblings('.accordion_in').slideUp(300);
    }
});

クリックしたli要素からクラス名を取得し
そこからクラス名に . を追加(そのまま使うとピリオドがなく要素の指定ができないから)