2011-05-10 11 views
5

Estoy tratando de ajustar los siguientes precios y texto juntos, todo en un DIV.jQuery agregue la primera parte de div, luego agregue la última parte de la división div

Esto es lo que tengo:

<table cellspacing="0" cellpadding="0" border="0" class="thePrices"> 
    <tbody><tr> 
     <td> 
      <font class="text colors_text"> 
      <b>MSRP: <span class="priceis">$90.00</span></b> 
      </font><br> 
      <b><font class="pricecolor colors_productprice"> 
       <font class="text colors_text"><b>Burkett Price:</b></font> 
       <span class="priceis">$289<sup>.99</sup></span> 
      </font> 
      </b><br> 
      <a href="a link">A link goes here</a> 
      <table>A TABLE WITH STUFF GOES HERE</table> 
     </td> 
     </tr></tbody> 
</table> 

Esto es lo que estoy tratando de conseguir: el trabajo

<table cellspacing="0" cellpadding="0" border="0" class="thePrices"> 
     <tbody><tr> 
      <td> 
      **<div class="pricebox">** 
       <font class="text colors_text"> 
        <b>MSRP: <span class="priceis">$90.00</span></b> 
       </font><br> 
       <b><font class="pricecolor colors_productprice"> 
        <font class="text colors_text"><b>Burkett Price:</b></font> 
        <span class="priceis">$289<sup>.99</sup></span> 
        </font> 
       </b><br> 
      **</div>** 
       <a href="a link">A link goes here</a> 
       <table>A TABLE WITH STUFF GOES HERE</table> 
      </td> 
      </tr></tbody> 
    </table> 

ésto no, pero usted consigue la idea de lo que estoy haciendo mal:

$(document).ready(function() { 
$('.thePrices').find('td').find('font:first').before('<div class="pricebox">'); 
$('.thePrices').find('.colors_productprice').find('b').after('</div>'); 
}); 

¿Debería usar SLICE?

+0

¿podría explicar más acerca de cómo desea que sea la salida? – Dhiraj

+0

Claro, solo quiero ENVOLVER la primera etiqueta de fuente y la etiqueta B juntas en un div ... en este ejemplo con la clase 'caja de precios'. – ToddN

Respuesta

5

Creo que lo que quiere es .wrapAll()
Actualizado, utilizar .andSelf() incluir <font/>

$('.thePrices').find('td').children().first().nextUntil('a').andSelf().wrapAll('<div class="pricebox"></div>'); 

Example on jsfiddle

+0

Buen consejo, no estaba al tanto de 'nextUntil', así que no creo que' wrap' pueda usarse para esto. –

+0

Esto ahora simplemente envuelve la parte del precio del producto, no la parte del MSRP. – ToddN

+0

@Mark Esto no funciona correctamente para mí. ¿Necesito envolver la primera etiqueta FONT también y solo está envolviendo la primera etiqueta B debajo del TD? – ToddN

0
$('.thePrices>tbody>tr>td').children().slice(0,3).wrapAll('<div class="pricebox"></div>'); 

Usos slice() para cortar los 3 primeros hijos antes de envolver ellos, nota un <br> es un niño si desea envolver el br antes de a cambiar el 3 a 4

Cuestiones relacionadas