JSFiddle - React, Tailwind, and code Playground
HTML
<script src="http://fancybox.net/js/fancybox-1.3.4/jquery.fancybox-1.3.4.js"></script>
<div class="listingContainer grid_9 alpha omega">
<a class="listContent" href="http://jsfiddle.net/echo/html/">
<div class="listingWrapper">
<div class="grid_8 alpha omega listingContent">
<div class="imgHolder">
<img src="http://dummyimag.es/30x30" alt="dummyimag.es" />
</div>
<div class="descHolder">
<div id="carsIreland"></div>
<h3>
Fancy Car
</h3>
<div class="removeCompare">
Remove
</div>
<p>
Lorem ipsum dolor sit amet, pri ex duis maiorum commune, illud viderer suscipiantur eam an. Dolorum recteque qui in. Pro inani nulla tacimates ex, qu
</p><span class="listingPrice">€4,000</span> <span class="listingDate">Listed: Today</span> <span class="listingLocation">Co. Waterford</span> <span class="listingViews">Viewed: 20
Times</span>
</div>
</div>
<div class="goTo goTo_unfocus grid_1 alpha omega gotoWrapper">
Click to View
<div class="imgVeiw"></div>
</div>
</div><!--End listingWrapper-->
</a>
</div>
CSS
div.removeCompare{
background-color:red;
}
.listContent{
border:1px solid black;
display:block;
}
JavaScript
$(".listContent").live('click', function(e) {
e.preventDefault();
$(this).fancybox({
'type': 'ajax'
});
console.log('inside fancybox creator');
});
$("div.removeCompare").live('mousedown', function(e) {
e.stopPropagation();
console.log('inside remove');
$(this).parents(".listingContainer").remove();
});