Hide element based on attribute value jquery

Question

How can I hide child div based on the attribute value of parent div. I have following markup:

<div class="offerContainer">
    <div class="Offers" producttype="CIP">
        <div class="buttons_wrap"></div>
    </div>
    <div class="Offers" producttype="P">
        <div class="buttons_wrap"></div>
    </div>
    <div class="Offers" producttype="CIP">
        <div class="buttons_wrap"></div>
    </div>
</div>

And I want to hide buttons_wrap only when atrribute value of producttype is "CIP".

Something like:

if($(obj).parents(".offersContainer").find('.Offers').attr('producttype').value == "CIP")
    $('.buttons_wrap').hide();

Panomosh · Accepted Answer · 2017-03-31 12:34:51Z

3

$('.buttons_wrap').each(function(){
    if($(this).parents('.Offers').attr('producttype') == "CIP"){
        $(this).hide();
    }
});

JSFIDDLE Example:

https://jsfiddle.net/Panomosh/kL11m73L/

answered Mar 31, 2017 at 12:34

Panomosh

9122 gold badges8 silver badges18 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Huma Ali Over a year ago

Yes, Simple and Works!

Panomosh Over a year ago

Normally, keeping it simple is the best approach! No problem @HumaAli

Aman Kumar · Accepted Answer · 2017-03-31 12:36:28Z

0

Try This custom method

$(function() {
var $offers = $('.Offers');
$offers.each(function() {
var productType = $(this).attr('producttype');
if(productType != "CIP")
{ 
   $(this).children().hide();
}
});
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<div class="offerContainer">
    <div class="Offers" producttype="CIP">
        <div class="buttons_wrap"><button>First</button></div>
    </div>
    <div class="Offers" producttype="P">
        <div class="buttons_wrap"><button>Second</button></div>
    </div>
    <div class="Offers" producttype="CIP">
        <div class="buttons_wrap"><button>Third</button></div>
    </div>
</div>

answered Mar 31, 2017 at 12:36

Aman Kumar

4,5573 gold badges21 silver badges40 bronze badges

Collectives™ on Stack Overflow

Hide element based on attribute value jquery

2 Answers 2

2 Comments

Try This custom method

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

2 Comments

Try This custom method

Comments

Your Answer

Sign up or log in

Post as a guest

Related