2016-01-14 3 views
1

У меня есть дочерний div, который нужно добавить с помощью класса с помощью jQuery.Как добавить класс в div после класса в jQuery?

<div class="main-content"> 
    <article class="post status-publish"> 
      <div class="post-content> 
       <div class="vc_row wpb_row vc_row-fluid"> 

        <div class="vc_col-sm-12 wpb_column vc_column_container "> 
        </div> 

       </div> 
      </div> 
    </article> 
</div> 

код JQuery, что я пытался до сих пор это:

j('.main-content .post-content').each(function() { 
    j(this).after().addClass('home-inner-content'); 
}); 

Это результат, который я желая для:

<div class="main-content"> 
    <article class="post status-publish"> 
      <div class="post-content> 
       <div class="vc_row wpb_row vc_row-fluid home-inner-content"> 

        <div class="vc_col-sm-12 wpb_column vc_column_container "> 
       </div> 

      </div> 
      </div> 
    </article> 
</div> 

Любая помощь приветствуется. Благодаря

ответ

3

Вы, вероятно, хотите что-то вроде:

j('.main-content .post-content').each(function() { 
    j(this).children().first().addClass('home-inner-content'); 
}); 

.after() для вставки содержимого, а не его размещения.

Но на самом деле, я не думаю, что вам нужна петля. Вы можете:

j('.main-content .post-content > *:first-child').addClass('home-inner-content'); 

Первая часть выбирает элементы, которые вы хотите. .addClass() добавляет класс к каждому из выбранных элементов.

+0

'j' даже не функция ... –

+1

@PatrickRoberts Конечно это. OP явно подразумевает, что у них есть '' 'jQuery ', сопоставленный с' j'. – Ouroborus

+0

Ну да, но почему ... это даже не стандарт для этого. –

3

Если я правильно вас понял, следующий код поможет.

$('.main-content .post-content>div').addClass('home-inner-content'); 
2

$('.main-content .post-content').each(function() { 
 
    $(this).children().addClass('home-inner-content'); 
 
});
body * { 
 
    padding-left: 1em; 
 
} 
 

 
body *:before { 
 
    font-family: monospace; 
 
    content: attr(class); 
 
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div class="main-content"> 
 
    <article class="post status-publish"> 
 
    <div class="post-content"> 
 
     <div class="vc_row wpb_row vc_row-fluid"> 
 
     <div class="vc_col-sm-12 wpb_column vc_column_container"> 
 
     </div> 
 
     </div> 
 
    </div> 
 
    </article> 
 
</div>

1

Вам не нужно использовать каждую функцию здесь.

j('.main-content .post-content>div').addClass('home-inner-content');

Смежные вопросы