Created
June 9, 2013 16:42
-
-
Save nastysloper/5744205 to your computer and use it in GitHub Desktop.
Node manipulation using (this) keyword http://jsfiddle.net/6w5mx/2/
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<div id="tours"> | |
<h1>Guided Tours</h1> | |
<ul> | |
<li class="usa tour" data-discount="299"> | |
<h2>New York, New York</h2> | |
<span class="details">$1,899 for 7 nights</span> | |
<button class="book">Book Now</button> | |
</li> | |
<li class="europe tour" data-discount="176"> | |
<h2>Paris, France</h2> | |
<span class="details">$2,299 for 7 nights</span> | |
<button class="book">Book Now</button> | |
</li> | |
<li class="asia tour" data-discount="349"> | |
<h2>Tokyo, Japan</h2> | |
<span class="details">$3,799 for 7 nights</span> | |
<button class="book">Book Now</button> | |
</li> | |
</ul> | |
</div> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
$(document).ready(function(){ | |
$('button').on('click', function(){ | |
var discount = $(this).closest(".tour").data("discount"); | |
var message = $("<span>Call 1-555-jquery-air and save $" + discount + "</span>"); | |
$(this).closest(".tour").append(message); | |
$(this).closest('.tour').find('.details').remove(); | |
$(this).remove(); | |
}); | |
}); |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment