隐藏元素中的元素与类

Question

我想隐藏<p class="crfp-field">在<ol class="comment-list">里面并显示它是否在里面。希望你能帮助我做到这一点。下面的代码是什么样子

<ol class="comment-list"> 
    <li class="comment"> 
     <div id="comment-n"> 
      <p>This is a comment</p> 
     </div> 

     <ul class="children"> 
      <li class="comment"> 
       <div id="comment-n"> 
        <p>This is a reply to a comment. Star rating is visible here. I don’t want to display it when I am replying to a comment.</p> 
       </div> 
       <div id="respond" class="comment-respond"> 
        <h3 id="reply-title" class="comment-reply-title">Write a Reply or Comment <small><a class="btn" rel="nofollow" id="cancel-comment-reply-link" href="" style="">Cancel Reply</a></small></h3> 
        <form action="http://../wp-comments-post.php" method="post" id="commentform" class="comment-form"> 
         <p class="comment-notes">Your email address will not be published.</p> 
         <p class="comment-form-author">Name<input id="author" name="author" type="text"></p> 
         <p class="comment-form-email">Email<input id="email" name="email" type="text"></p> 
         <p class="comment-form-url">Website<input id="url" name="url" type="text"></p> 
         <!-- CRFP Fields: Start --> 
         <p class="crfp-field"> 
          <!-- CRFP Stuff --> 
         </p> 
         <!-- CRFP Fields: End --> 
         <p class="comment-form-comment">Comment<textarea id="comment" name="comment"></textarea></p> 
         <input id="submit-new" value="Post Comment" type="submit"> 
        </form> 
       </div> 
      </li><!-- #comment-## --> 
     </ul><!-- .children --> 
    </li><!-- #comment-## --> 
</ol> 

Answer 1

这应做到：

$('.comment-list .crfp-field').hide(); 

Answer 2

您可以使用CSS这一点，没有JS要求：

ol.comment-list p.crfp-field { 
    display: none; 
} 

如果p.crfp-field元素不是内部ol则上述规则将不会应用，并且该元素将按正常方式显示。

Answer 3

您可以通过以下方式做实现它：

$(document).ready(function(){ 
    $("p.crfp-field").show(); //show all p tag with class crfp-field 
    $("ol.comment-list p.crfp-field").hide(); //hide the needed ones 
});