js 循环里面如何使用点击事件

直接上代码
html

{%foreach  from=$datainfo.datalist item=list %}
            <li class="fl recording-item">
                <a href="javascript:void(0)"><span class="play" vid={%$list.url%}  data-id="{%$list.id%}"><i></i></span></a>
            </li>
 {%/foreach%}

js代码

$(".play").each(function () {
            $(this).click(function(){
                var sid = $(this).attr('data-id');
                var surl = $(this).attr('vid');
                $.ajax({url: "地址",data: {sid:sid,type:type}, type: "POST",dataType:'json', success: function(data) {
                    if(data.code = "success"){
                    var new_url = surl +'&k='+encodeURIComponent(data.msg);
                    let width = 550;
                    let height = 373;
                    let top = (window.screen.availHeight - height) / 2;
                    let left = (window.screen.availWidth - width) / 2;
                    window.open(new_url,'newindow','height=' + height + ',width = ' + width + ',top = ' + top + ',left = ' + left + 'toolbar = no,menubar=no,scrollbars=no,location=no,status=no');  
                    }else{
                        showNotice(data.msg);
                    }
                }});
            });
        });