JSFiddle - React, Tailwind, and code Playground

by Rahul Sharma

HTML

<div class="CollectionLeft">
    <div class="CollectionLeftTop"> <a href="http://a3-401/rajrang/a-stylish-traditional-look-designer-boho-bohemian-bandhej-bandhini-cotton-salwar-suit-slu00523.html"><img title="A Stylish Traditional Look Designer Boho Bohemian Bandhej Bandhini Cotton Salwar Suit" alt="A Stylish Traditional Look Designer Boho Bohemian Bandhej Bandhini Cotton Salwar Suit" src="http://rajrang.com/ProductImages/264x39239609581_85d4_4eaa_9bb4_d5c523696b8b.jpg"></a>

        <p><a href="http://a3-401/rajrang/a-stylish-traditional-look-designer-boho-bohemian-bandhej-bandhini-cotton-salwar-suit-slu00523.html">A Stylish Traditional Look Designer Boho Bohemian Bandhej Bandhini Cotton Salwar Suit</a>

        </p>
        <input type="hidden" class="lastId" value="11091">
    </div>
    <div class="CollectionLeftMiddle">
        <div class="PriceListing"> <span>SLU00523</span>&nbsp;Rs 1420.00</div>
    </div>
    <div class="CollectionLeftbottom">
        <div class="View"> <a href="http://a3-401/rajrang/a-stylish-traditional-look-designer-boho-bohemian-bandhej-bandhini-cotton-salwar-suit-slu00523.html">VIEW</a> 
        </div>
        <div class="View"> <a class="addtocompare" href="#">COMPARE</a> 
        </div>
        <div class="View"> <a class="buy" href="#">BUY</a> 
        </div>
    </div>
</div>

JavaScript

$('.buy').click(function(){
    alert('buy clicked');
    var productId =$(this).closest('.CollectionLeft').find('.lastId').val();
    var imageName = $(this).closest('.CollectionLeft').find('img').attr('src');
    var productname = $(this).closest('.CollectionLeft').find('p').text();
    
    var productcode =$(this).closest('.CollectionLeft').find('.PriceListing span').text();
   
});