只有在使用jquery检查后才在div之前添加元素

Question

我在按钮点击div之前添加标签,如下所示:

$(".deletebutton").before("<label></label>");

这里.deletebutton是一个div.但我发现通过多次点击可以添加多个标签.我想检查div之前是否存在标签.如果是的话,我不想再添加一个.

我的HTML结构是这样的:

<li>
    <label></label>
    <div class="deletebutton"></div>
<li>

请建议

[更新]任何更好的解决方案？这对我有用

if ($(".deletebutton").prev().get(0).tagName != 'LABEL') {
    $(".deletebutton").before("<label></label>");
} else {
    $(".deletebutton").prev().remove();
    $(".deletebutton").before("<label></label>");
}

如果我们想检查父母怎么办？

@silentw如果每次都有一个div添加了什么.deletebutton？

我使用以下代码,但它不起作用:

var parentTag = $(".ruRemove").parent().get(0).tagName;

if (parentTag == 'LI') {
    $(".ruRemove").wrap("<div class='data deletebutton'></div>");
    $(".deletebutton").before("<label></label>");
} else {

    var par = $('.deletebutton').parent();
    if (par.is('div')) par.remove();
    $(".ruRemove").wrap("<div class='data deletebutton'></div>");

    var prev = $('.deletebutton').prev();
    if (prev.is('label')) prev.remove();
    $('.deletebutton').before("<label></label>");
}

<label> </label>
<div class="deletebutton">
    <label> </label>
    <div class="deletebutton">
        <label> </label>
        <div class="deletebutton">
        </div>
    </div>
</div>

Answer 1

$(".deletebutton").on('click', function() {
    if(!$(this).prev().is('label')) $(this).before("<label>A</label>");
});

DEMO

更新

$(".deletebutton").on('click', function() {
    var prev = $(this).prev();
    if(prev.is('label')) prev.remove();
    $(this).before("<label>This is a label</label>");
});

DEMO 2