Skip to content

Instantly share code, notes, and snippets.

@nastysloper
Created June 9, 2013 16:42
Show Gist options
  • Save nastysloper/5744205 to your computer and use it in GitHub Desktop.
Save nastysloper/5744205 to your computer and use it in GitHub Desktop.
Node manipulation using (this) keyword http://jsfiddle.net/6w5mx/2/
<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>
$(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