为什么不管点击哪里 执行的都是绑定在最外面div上的事件 也阻止了事件冒泡 布局也没问题

Question

<div class="checkmsg">        <select>            <option>无</option>            <option>上传图片不符合正常规范</option>            <option>图片不清晰</option>            <option>违规商品</option>            <option>敏感词</option>        </select>        <div class="send_textarea">            <textarea id="msg"></textarea>        </div>        <button style="margin-left:975px">确认</button>        <button id="cancle">取消</button>    </div>js部分$('.checkmsg select').change(function() {        var str = $('.checkmsg select').find("option:selected").text();        var _html = "<p>"+str+"<span id ='del'>x</span></p><br>";        $(_html).insertBefore('#msg');    });$('#del').click(function(event){        event.stopPropagation();        alert('ok');        console.log(e.target)    });    $('.send_textarea').click(function(e){        alert('div了');        console.log(e.target)    });    $('#msg').click(function(){        alert('text了')    });为什么每次不管点击什么地方都alert 点击div了