clone subclass of class that :contains specific string

Question

I am trying to clone a specific subclass of a class that contains specific text but can't find a way to do it. can't use :eq() or :firstchild because there are multiple classes with the same name and can change the order

jquery I have been trying to select multiple classes

 var rate = $(".header a").text()


  if  (t_hotelCode="zzzz")
  {
    if (rate == "Super")
    {


      $('.header a:contains("Super").policy').clone().insertAfter(".policy")
      $(".childrenPolicy").eq(1).each(function(){
      $(this).html($(this).html().replace('Policy', 'other'))
});
    }
  }

if I use the following it works but it clones every single class named policy

 var rate = $(".header a").text()
  if  (t_hotelCode="zzzz")
  {
    if (rate == "Super")
    {
  $('.Policy').clone().insertAfter(".Policy")
  $(".childrenPolicy").eq(1).each(function(){
  $(this).html($(this).html().replace('Policy', 'other'))
    });
    }
  }

HTML of class I am trying to clone, I can only use string h4 super h4 everything else changes

<div id="roomsrates_list" class="ratelistview">
  <div id="room_1" class="roomrate room closed">
    <div class="header">
    <div class="room" style="display:none;">
    <div class="content">
      <div class="rates">
        <div id="room1_rate1" class="rate opened" relgross="" rel="" data-rrc="IC">
           <div class="ratesperday hidden">
           <div class="layerrateinfos hidden">
           <div class="header">
              <a class="iconbutton iconbutton1" href="#"> </a>
              <h4>Super</h4>
              <div class="rateicons">
              <div class="price">
              <div class="discountPrice"> </div>
              <div class="clear"> </div>
           </div>
           <div class="border"> </div>
           <div class="content" style="">
           <p></p>
           <a class="details details" href="Javascript:void(0)">
           <a class="details details_policies" href="Javascript:void(0)">
           <div class="clear"> </div>
           <div class="detailcontent_policies" style="">
             <div class="depositPolicy">
               <strong>Deposit</strong>
               <br>
               <p></p>
               <br>
            </div>
           <div class="cancellationPolicy">
           <div class="checkinDescription">
           <div class="Policy">
        </div>
        <div class="detail" style="display:none;">
        <div class="clear"> </div>
     </div>
   </div>
 </div>
<div class="clear"> </div>

Answer 1

Something like this might get you started:

$('#mybutt').click(function(){
	var supr = $('.content>.rates h4:contains(Super)');
	/*
	var s2 = sing.closest('.layerrateinfos'); //('.layerrateinfos');
	var s3 = s2.find('.policies .Policy');
	var s4 = s3.text();
	alert( s4 );
	*/
	var pols = supr.closest('.layerrateinfos').find('.policies');
	var pol = pols.find('.Policy');
	pol.clone().text('New Policy').appendTo( pols );
});

#room1_rate1{background:wheat;}
#room1_rate2{background:pink;}
#room1_rate3{background:palegreen;}
#room1_rate4{background:beige;}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<div class="content">
	<div class="rates">
		<div id="room1_rate1" class="rate opened" data-rrc="CK">
			<div class="ratesperday hidden">
				<div class="layerrateinfos hidden">
					<div class="header">
						<a class="iconbutton iconbutton1" href="#"> </a>
						<h4>Single</h4>
						<div class="clear"> </div>
					</div>
					<div class="border"> </div>
					<div class="clear"> </div>
					<div class="policies" style="">
						<div class="Policy">Policy Div</div>
					</div>
				</div>
			</div>
		</div>
		
		<div id="room1_rate2" class="rate opened" data-rrc="CK">
			<div class="ratesperday hidden">
				<div class="layerrateinfos hidden">
					<div class="header">
						<a class="iconbutton iconbutton1" href="#"> </a>
						<h4>Super</h4>
						<div class="clear"> </div>
					</div>
					<div class="border"> </div>
					<div class="clear"> </div>
					<div class="policies" style="">
						<div class="Policy">Policy Div</div>
					</div>
				</div>
			</div>
		</div>
		
		<div id="room1_rate3" class="rate opened" data-rrc="CK">
			<div class="ratesperday hidden">
				<div class="layerrateinfos hidden">
					<div class="header">
						<a class="iconbutton iconbutton1" href="#"> </a>
						<h4>Double</h4>
						<div class="clear"> </div>
					</div>
					<div class="border"> </div>
					<div class="clear"> </div>
					<div class="policies" style="">
						<div class="Policy">Policy Div</div>
					</div>
				</div>
			</div>
		</div>
		
		<div id="room1_rate4" class="rate opened" data-rrc="CK">
			<div class="ratesperday hidden">
				<div class="layerrateinfos hidden">
					<div class="header">
						<a class="iconbutton iconbutton1" href="#"> </a>
						<h4>Presidential</h4>
						<div class="clear"> </div>
					</div>
					<div class="border"> </div>
					<div class="clear"> </div>
					<div class="policies" style="">
						<div class="Policy">Policy Div</div>
					</div>
				</div>
			</div>
		</div>
		
	</div>
</div>
<button id="mybutt">Clone Summat</button>

Here is a jsFiddle of the same to experiment with (easier than playing with stack snippets)

You were updating question code (thank you) while I was composing answer, so if anything not clear leave a comment.

---

Notes:

1. Use of contains: in $('.content>.rates h4:contains(Super)') Reference Note that the > might not be necessary - a space might be preferable.
2. In the jsFiddle, I show how I built the correct jQuery selector, using several steps and console.log with .length at each step
3. Use .text() if only contains text, or .html() if need to add HTML tags also