Dynamically add classes to child elements by looping through a div

Question

I need a jquery script to dynamically add a class to a div in a class line. The class is intended for setting fields. If there are two div classes in the class, add the class to the first only, and if there are three div classes, add the class to two, avoiding the third.

So the actual need is to compute the div in the row and add classes to the div other than the last. Here is my html: -

<div class="row"> <div class="two-col"> <h3>Header 2/3 Column</h3> <p>Kidney Cancer Canada is a charitable patient-led support organization established to improve the quality of life for patients and their families living with kidney cancer. <a href="#">Kidney Cancer Canada</a> advocates for access to netreatments, provides support and information to patients, funds much-needed research, and works to increase awareness of kidney cancer as a significant health issue. Our goal is to help patients navigate through information about their disease and ensure they have access to new treatment options available to them.</p> </div> <div class="one-col"> <h3>Header 1/3 Column</h3> <p>KCC hosts patient and caregiver education meetings and webcasts from locations all across canada. Atttending meetings in-person provides an excellent oppurtunity to meet other kidney cancer patients, caregivers, and healthcare professionals</p> </div> <div class="clear"></div> </div> <div class="row"> <div class="one-col"> <h3>Header 1/3 Column</h3> <p>KCC hosts patient and caregiver education meetings and webcasts from locations all across canada. Atttending meetings in-person provides an excellent oppurtunity to meet other kidney cancer patients, caregivers, and healthcare professionals</p> </div> <div class="one-col"> <h3>Header 1/3 Column</h3> <p>KCC hosts patient and caregiver education meetings and webcasts from locations all across canada. Atttending meetings in-person provides an excellent oppurtunity to meet other kidney cancer patients, caregivers, and healthcare professionals</p> </div> <div class="one-col"> <h3>Header 1/3 Column</h3> <p>KCC hosts patient and caregiver education meetings and webcasts from locations all across canada. Atttending meetings in-person provides an excellent oppurtunity to meet other kidney cancer patients, caregivers, and healthcare professionals</p> </div> <div class="clear"></div> </div> 

Answer 1

If you do not want to apply this class to divs the clear class, you can use this

 $('div.row').find('div').addClass('yourclass').not(':last-child,.clear'); 

or

 $('div.row').find('div').addClass('yourclass').not(':last-child'); 

Live sample

Answer 2

Here is the script to complete this task:

  $.each($(".row"),function () { var length = $(this).find('.two-col').length+$(this).find('.one-col').length+$(this).find('.three-col').length; for(i=1;i<length;i++) { $(this).find(":nth-child("+i+")").addClass('margin-right'); } }); 

Answer 3

 $("div.row").each(function(){ len = $(this).find("div").length ; if ($(this).find("div.clear").length > 0){ len = len-1; } var i=0; $(this).find("div").each(function(){ if($(this).attr("class") != "clear"){ if (i < len-1 ){ $(this).addClass("margin_class"); } } i++; }); });