javascript - jQuery wrap each item except one -


i'm trying wrap content within .product.type-productdiv, excluding first div (which contains image). i've tried following neither work! , advice helpful.

js

v1.

$('.product.type-product').each(function() {      $(this).children('div,h3,span,form').not(':first-child').wrapall('<div class="new columns small-12 medium-12 large-6" />');    } 

v2.

$('.product.type-product').children('div,h3,span,form').not(':first-child').wrapall('<div class="new columns small-12 medium-12 large-6" />'); 

html

<div class="post-886 product type-product status-publish has-post-thumbnail first instock shipping-taxable purchasable product-type-simple">   <div class="image columns small-12 medium-12 large-6">     <img width="800" height="389" src="xxx.jpg" class="attachment-post-thumbnail size-post-thumbnail wp-post-image" alt="ebwl008_voucher_bowl-fr" srcset="xxx.jpg 800w, xxx.jpg 1024w, xxx.jpg 1080w" sizes="(max-width: 800px) 100vw, 800px">   </div>   <!-- wrap start -->   <h3>1 hour family bowling session</h3>   <div itemprop="description">     <p>reserve lane 60 minutes of family fun. automatic bumper system. bowling ramps available. shoe hire included.</p>     <ul>       <li>up 6 people 1 hour</li>       <li>1 player must junior (under 16)</li>     </ul>     <p>can used time sun – thurs or 6pm fri – sat</p>     <p>to book please call on 01422 301123</p>   </div>   <span class="price"><span class="woocommerce-price-amount amount"><span class="woocommerce-price-currencysymbol">£</span>25.00</span></span>   <form action="/electric-bowl/wordpress/shop/?add-to-cart=886" class="cart" method="post" enctype="multipart/form-data">     <div class="quantity">       <input type="number" step="1" min="" max="" name="quantity" value="1" title="qty" class="input-text qty text" size="4" pattern="[0-9]*" inputmode="numeric">     </div>     <button type="submit" class="button alt">add cart</button>   </form>   <!-- wrap end --> </div> <div class="post-886 product type-product status-publish has-post-thumbnail first instock shipping-taxable purchasable product-type-simple">   <div class="image columns small-12 medium-12 large-6">     <img width="800" height="389" src="xxx.jpg" class="attachment-post-thumbnail size-post-thumbnail wp-post-image" alt="ebwl008_voucher_bowl-fr" srcset="xxx.jpg 800w, xxx.jpg 1024w, xxx.jpg 1080w" sizes="(max-width: 800px) 100vw, 800px">   </div>   <!-- wrap start -->   <h3>1 hour family bowling session</h3>   <div itemprop="description">     <p>reserve lane 60 minutes of family fun. automatic bumper system. bowling ramps available. shoe hire included.</p>     <ul>       <li>up 6 people 1 hour</li>       <li>1 player must junior (under 16)</li>     </ul>     <p>can used time sun – thurs or 6pm fri – sat</p>     <p>to book please call on 01422 301123</p>   </div>   <span class="price"><span class="woocommerce-price-amount amount"><span class="woocommerce-price-currencysymbol">£</span>25.00</span></span>   <form action="/electric-bowl/wordpress/shop/?add-to-cart=886" class="cart" method="post" enctype="multipart/form-data">     <div class="quantity">       <input type="number" step="1" min="" max="" name="quantity" value="1" title="qty" class="input-text qty text" size="4" pattern="[0-9]*" inputmode="numeric">     </div>     <button type="submit" class="button alt">add cart</button>   </form>   <!-- wrap end --> </div> <div class="post-886 product type-product status-publish has-post-thumbnail first instock shipping-taxable purchasable product-type-simple">   <div class="image columns small-12 medium-12 large-6">     <img width="800" height="389" src="xxx.jpg" class="attachment-post-thumbnail size-post-thumbnail wp-post-image" alt="ebwl008_voucher_bowl-fr" srcset="xxx.jpg 800w, xxx.jpg 1024w, xxx.jpg 1080w" sizes="(max-width: 800px) 100vw, 800px">   </div>   <!-- wrap start -->   <h3>1 hour family bowling session</h3>   <div itemprop="description">     <p>reserve lane 60 minutes of family fun. automatic bumper system. bowling ramps available. shoe hire included.</p>     <ul>       <li>up 6 people 1 hour</li>       <li>1 player must junior (under 16)</li>     </ul>     <p>can used time sun – thurs or 6pm fri – sat</p>     <p>to book please call on 01422 301123</p>   </div>   <span class="price"><span class="woocommerce-price-amount amount"><span class="woocommerce-price-currencysymbol">£</span>25.00</span></span>   <form action="/electric-bowl/wordpress/shop/?add-to-cart=886" class="cart" method="post" enctype="multipart/form-data">     <div class="quantity">       <input type="number" step="1" min="" max="" name="quantity" value="1" title="qty" class="input-text qty text" size="4" pattern="[0-9]*" inputmode="numeric">     </div>     <button type="submit" class="button alt">add cart</button>   </form>   <!-- wrap end --> </div> 

use :first pseudo-class selector.

$('.product.type-product').each(function() {   $(this).children('div,h3,span,form').not(':first').wrapall('<div class="new columns small-12 medium-12 large-6" />'); }) 

$('.product.type-product').each(function() {    $(this).children('div,h3,span,form').not(':first').wrapall('<div class="new columns small-12 medium-12 large-6" />');  })
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>  <div class="post-886 product type-product status-publish has-post-thumbnail first instock shipping-taxable purchasable product-type-simple">    <div class="image columns small-12 medium-12 large-6">      <img width="800" height="389" src="xxx.jpg" class="attachment-post-thumbnail size-post-thumbnail wp-post-image" alt="ebwl008_voucher_bowl-fr" srcset="xxx.jpg 800w, xxx.jpg 1024w, xxx.jpg 1080w" sizes="(max-width: 800px) 100vw, 800px">    </div>    <!-- wrap start -->    <h3>1 hour family bowling session</h3>    <div itemprop="description">      <p>reserve lane 60 minutes of family fun. automatic bumper system. bowling ramps available. shoe hire included.</p>      <ul>        <li>up 6 people 1 hour</li>        <li>1 player must junior (under 16)</li>      </ul>      <p>can used time sun – thurs or 6pm fri – sat</p>      <p>to book please call on 01422 301123</p>    </div>    <span class="price"><span class="woocommerce-price-amount amount"><span class="woocommerce-price-currencysymbol">£</span>25.00</span>    </span>    <form action="/electric-bowl/wordpress/shop/?add-to-cart=886" class="cart" method="post" enctype="multipart/form-data">      <div class="quantity">        <input type="number" step="1" min="" max="" name="quantity" value="1" title="qty" class="input-text qty text" size="4" pattern="[0-9]*" inputmode="numeric">      </div>      <button type="submit" class="button alt">add cart</button>    </form>    <!-- wrap end -->  </div>  <div class="post-886 product type-product status-publish has-post-thumbnail first instock shipping-taxable purchasable product-type-simple">    <div class="image columns small-12 medium-12 large-6">      <img width="800" height="389" src="xxx.jpg" class="attachment-post-thumbnail size-post-thumbnail wp-post-image" alt="ebwl008_voucher_bowl-fr" srcset="xxx.jpg 800w, xxx.jpg 1024w, xxx.jpg 1080w" sizes="(max-width: 800px) 100vw, 800px">    </div>    <!-- wrap start -->    <h3>1 hour family bowling session</h3>    <div itemprop="description">      <p>reserve lane 60 minutes of family fun. automatic bumper system. bowling ramps available. shoe hire included.</p>      <ul>        <li>up 6 people 1 hour</li>        <li>1 player must junior (under 16)</li>      </ul>      <p>can used time sun – thurs or 6pm fri – sat</p>      <p>to book please call on 01422 301123</p>    </div>    <span class="price"><span class="woocommerce-price-amount amount"><span class="woocommerce-price-currencysymbol">£</span>25.00</span>    </span>    <form action="/electric-bowl/wordpress/shop/?add-to-cart=886" class="cart" method="post" enctype="multipart/form-data">      <div class="quantity">        <input type="number" step="1" min="" max="" name="quantity" value="1" title="qty" class="input-text qty text" size="4" pattern="[0-9]*" inputmode="numeric">      </div>      <button type="submit" class="button alt">add cart</button>    </form>    <!-- wrap end -->  </div>  <div class="post-886 product type-product status-publish has-post-thumbnail first instock shipping-taxable purchasable product-type-simple">    <div class="image columns small-12 medium-12 large-6">      <img width="800" height="389" src="xxx.jpg" class="attachment-post-thumbnail size-post-thumbnail wp-post-image" alt="ebwl008_voucher_bowl-fr" srcset="xxx.jpg 800w, xxx.jpg 1024w, xxx.jpg 1080w" sizes="(max-width: 800px) 100vw, 800px">    </div>    <!-- wrap start -->    <h3>1 hour family bowling session</h3>    <div itemprop="description">      <p>reserve lane 60 minutes of family fun. automatic bumper system. bowling ramps available. shoe hire included.</p>      <ul>        <li>up 6 people 1 hour</li>        <li>1 player must junior (under 16)</li>      </ul>      <p>can used time sun – thurs or 6pm fri – sat</p>      <p>to book please call on 01422 301123</p>    </div>    <span class="price"><span class="woocommerce-price-amount amount"><span class="woocommerce-price-currencysymbol">£</span>25.00</span>    </span>    <form action="/electric-bowl/wordpress/shop/?add-to-cart=886" class="cart" method="post" enctype="multipart/form-data">      <div class="quantity">        <input type="number" step="1" min="" max="" name="quantity" value="1" title="qty" class="input-text qty text" size="4" pattern="[0-9]*" inputmode="numeric">      </div>      <button type="submit" class="button alt">add cart</button>    </form>    <!-- wrap end -->  </div>


Comments

Popular posts from this blog

php - How to add and update images or image url in Volusion using Volusion API -

javascript - IE9 error '$'is not defined -