CODEWITHSUNDEEP
javascriptjqueryhtmlcss
siva
siva

Reputation: 1481

traverse element inside the div

html:

<div style="width: 260px;margin:25px 0 0 30px">
<input type="checkbox"  name="send_email" class="delete_followup" />Send email alerts
<input type="checkbox" value="delete" type="checkbox" />Send SMS alerts <button type="submit" name="delete" value="{{follower.id}}" class="delete_follower">Delete</button>
</div>

js:

$(".delete_followup").click(function(){
var $this = $(this);
$(this).find(".delete_follower").show();           
});

I want to show the hidden button on clicking the delete_followup class.i TRIED WITH ABOVE jQuery but not working.

Upvotes: 3

Views: 480

Answers (4)

Sergio
Sergio

Reputation: 28845

Try this:

$(".delete_followup").click(function () {
    if (this.checked) {
        $(this).siblings(".delete_follower").show();
    } else {
        $(this).siblings(".delete_follower").hide();
    }
});

Demo here

Upvotes: 1

haz0rd
haz0rd

Reputation: 270

You are trying to search downward into the div, when you already have a reference to the element you want. Making it way more complicated than it needs to be lol

$(".delete_followup").click(function(){
   $(this).show();           
});

Whenever you trigger off a click event, the actual element clicked on is passed through as the scope of the function. Since you are triggering off the click of ".delete_followup", that div is your element scope

Upvotes: 1

Ivan Chernykh
Ivan Chernykh

Reputation: 42176

Or try .nextAll:

$(this).nextAll(".delete_follower").show();

Working here: http://jsfiddle.net/tw5XK/

Upvotes: 1

Arun P Johny
Arun P Johny

Reputation: 388406

The delete_follower element is not a decedent of delete_followup element, it is a sibling element so instead of find() you need to use siblings()

$(".delete_followup").click(function(){
    var $this = $(this);
    $this.siblings(".delete_follower").show();           
});

Upvotes: 1

Related Questions