How to Find a Parent with a Known Class in Jquery

How to find a parent with a known class in jQuery?

Assuming that this is .d, you can write

$(this).closest('.a');

The closest method returns the innermost parent of your element that matches the selector.

Jquery - Find the closest parent having a class name

To get the first one parent of specific class:

$(this).parents('.selectable').first();

get parent element by class using jquery

You need to use .closest(). .parent() will search only the direct parent node, since you are looking for a matching ancestor element use .closest()

$('.sms').click(function() {  var id = $(this).closest('.message').data("id");  alert(id);})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script><div class="message" data-id="4">  <div>    <div class="msg-button">      <span class="sms"></span>    </div>    <div>      <div>        <div>          <span class="sms">sms</span>        </div>      </div>    </div>  </div></div>

JQuery find first parent element with specific class prefix

Use .closest() with a selector:

var $div = $('#divid').closest('div[class^="div-a"]');

How to find parent of child element by class - Jquery

You can use document.querySelectorAll() to find all elements with class "child" that have a parent with class "parent":

var children = document.querySelectorAll(".parent .child");

That gives you back a list of nodes that match, possibly an empty list:

for (var i = 0; i < children.length; ++i)
  children[i].innerHTML = "New Text";

The .querySelector() and querySelectorAll() methods work (mostly) even in IE8, so this approach is pretty universal.

Since you tagged the question with jQuery, you could do it with that library too:

$(".parent .child").html("New Text");

That will update all of the "child" elements with a "parent" parent node; jQuery does all the iteration for you.

JQuery - Get parent of parent by class

source: https://api.jquery.com/parent/

so it should be:

$( "#id_1" ).parent().parent().css( "background-color", "red" );

How to check class of parent element by using jquery

You should use parentmethod, for more information Jquery .parent()

So in your function it will be:

$(document).ready(function () {
    $("#personalData1").change(function () {
        $('#opc_payment_methods-content').removeClass('hide');

        if ($('#personalData1').parent().hasClass('checked') == false) {
            window.alert('ok');
            $('#personalData1').parent().addClass('checked');
        }
    });
});

Hope it helps,

how to find a parent class and its children

Assuming you have the hierarchy as shown in your description and if, for example, you have the Order_Coupon element selected, you can get the coupon amount by the .children method.

var amount=$('.Order_Coupon').children().html();

Depending on what you have selected, you may have to use multiple calls of .child to find the coupon_amount element.

var amount=$('.Order_Left').children().children().children().html();

However, if each of these elements have ids or classes, it's much safer to use the .find method and specify a selector. Find also searches further than one child layer.

var amount=$('.Order_Left').find('.Coupon_Amount').html();

This way you ensure you get the value of the correct element. If there are more than one child element any of the div's you call .children on, without specifying a selector, you are likely to get very incorrect results.

How to find a parent with a known class in plain JavaScript

You can try using closest()

document.querySelectorAll('.child').forEach(function(child){  console.log(child.closest('.parent'));});

<div class="parent">  <div class="child">      </div>  <div class="child">    <!-- Some code here -->  </div></div><div class="parent">  <!-- some code here --></div>

jquery select class inside parent div

you can use the parent div as the scope:

 $('.add_answer',$(this).parent('div:first')).attr('alt',count);

---

Related Topics