CODEWITHSUNDEEP
jquerylayerchildren
Goldie
Goldie

Reputation: 1630

Removing parent without clicking on children

I have layer A and layer B inside layer A

enter image description here

http://jsfiddle.net/PhZhY/

Is it possible to remove layer A with jQuery function remove() clicking just on on layer A and not on layer B?

Upvotes: 4

Views: 133

Answers (3)

loler
loler

Reputation: 2587

If you want .b1 to remain and delete just .a1

$('.a1').live('click',function() {
     $(".b1", this).unwrap();
});

http://jsfiddle.net/PhZhY/3/

You can remove that div even if you don't know any child element:

$('.a1').live('click',function() {
     $(".a1 :first-child").unwrap();
});

http://jsfiddle.net/PhZhY/5/

If you want to remove .a1 div if it's not clicked within .b2 this is what you need:

$('.a1').live('click',function() {
     $(".a1 :first-child").unwrap();
});

$('.b1').live('click',function() {
 throw "stop execution";
});​

http://jsfiddle.net/PhZhY/6/

According to @Rick Calder's comment: If you want you can use .addClass() to change class or .removeClass() to remove class.

Upvotes: 2

Abhilash
Abhilash

Reputation: 1610

Here's how I read the question:

If you click on .b1, nothing should happen. If you click on .a1 it should be removed.

If that's the intent, here's the jQuery:

$('.b1').click( function(e){
  e.stopImmediatePropagation();
});

$('.a1').click( function(){
  $(this).remove();
});

Here's a jsbin. Note: css, html shamelessly stolen from @Vision's jsFiddle

Upvotes: 0

VisioN
VisioN

Reputation: 145458

$("body").on("click", ".a1", function(e) {
    if (this === e.target) $(this).remove();
});​

DEMO: http://jsfiddle.net/PhZhY/1/

Upvotes: 3

Related Questions