Reputation: 27996
I am adding a label before a div on button click like this:
$(".deletebutton").before("<label></label>");
where .deletebutton
is a div
. But I see that with multiple clicks multiple labels are added. I want to check if a label exists before the div already. If it does I don't want to add another one.
My HTML structure is this:
<li>
<label></label>
<div class="deletebutton"></div>
<li>
Please suggest
[UPDATE] any better solution ? This worked for me
if ($(".deletebutton").prev().get(0).tagName != 'LABEL') {
$(".deletebutton").before("<label></label>");
} else {
$(".deletebutton").prev().remove();
$(".deletebutton").before("<label></label>");
}
what if we want to check for parents:
@silentw what if there is a div added each time around .deletebutton ?
i used following code but it is not working:
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>
Upvotes: 0
Views: 188
Reputation: 4885
$(".deletebutton").on('click', function() {
if(!$(this).prev().is('label')) $(this).before("<label>A</label>");
});
$(".deletebutton").on('click', function() {
var prev = $(this).prev();
if(prev.is('label')) prev.remove();
$(this).before("<label>This is a label</label>");
});
Upvotes: 6