jquery - Insert div and li before and after some elements -

jquery - Insert div and li before and after some elements -

$('.createcasedata').html(gethtml(data)); $( 'label' ).before( "<li class='ui-field-contain ui-li-static ui-body-inherit'>" ); $( 'input' ).before( "<div class='ui-input-text ui-body-inherit ui-corner-all ui-shadow-inset ui-input-has-clear'>" ); $( 'input' ).after('</div>'); $( 'input' ).after('</li>'); $('textarea').attr('class','ui-input-text ui-shadow-inset ui-body-inherit ui-corner-all ui-textinput-autogrow');

want accomplish :

<li data-role="fieldcontain" class="ui-field-contain ui-li-static ui-body-inherit"> <label for="test" mobile="" name="">test mobile name</label> <div class="ui-input-text ui-body-inherit ui-corner-all ui-shadow-inset ui-input-has-clear"> <input name="name" type="name" required="" calculated="false" len="150"> </div> </li>

what getting right now:

<li class="ui-field-contain ui-li-static ui-body-inherit"></li> <label for="test" mobile="" name="">test mobile name</label> <div class="ui-input-text ui-body-inherit ui-corner-all ui-shadow-inset ui-input-has-clear"></div> <input name="name" type="name" required="" calculated="false" len="150">

please help

my info is:

<form id="caseform" action="url"> <label for=test mobile name>test mobile name</label> <input name="name" type="name" required calculated="false" len="150" /> <label for=office phone:>office phone:</label> <input name="phone_office" type="tel" len="100" /> <label for=website:>website:</label> <input name="website" type="url" len="255" /> <label for=fax:>fax:</label> <input name="phone_fax" type="tel" len="100" /> <label for=billing street:>billing street:</label> <input name="billing_address_street" type="varchar" group="billing_address" calculated="false" len="150" /> <label for=shipping street:>shipping street:</label> <input name="shipping_address_street" type="varchar" group="shipping_address" calculated="false" len="150" /> <label for=email address:>email address:</label> <input name="email1" type="varchar" group="email1" calculated="false" len="" />description: <textarea name="description" type="text" group="" id_name="" required related_module="" calculated="false" len="">description:</textarea> <label class="select">type:</label> <select name="account_type" type="enum" group="" id_name="" required related_module="" calculated="false" len="50"> <option value=""></option> <option value="analyst">analyst</option> <option value="competitor">competitor</option> <option value="customer">customer</option> <option value="integrator">integrator</option> <option value="investor">investor</option> <option value="partner">partner</option> <option value="press">press</option> <option value="prospect">prospect</option> <option value="reseller">reseller</option> <option value="other">other</option> </select> <label class="select">industry:</label> <select name="industry" type="enum" group="" id_name="" required related_module="" calculated="false" len="50"> <option value=""></option> <option value="apparel">apparel</option> <option value="banking">banking</option> <option value="biotechnology">biotechnology</option> <option value="chemicals">chemicals</option> <option value="communications">communications</option> <option value="construction">construction</option> <option value="consulting">consulting</option> <option value="education">education</option> <option value="electronics">electronics</option> <option value="energy">energy</option> <option value="engineering">engineering</option> <option value="entertainment">entertainment</option> <option value="environmental">environmental</option> <option value="finance">finance</option> <option value="government">government</option> <option value="healthcare">healthcare</option> <option value="hospitality">hospitality</option> <option value="insurance">insurance</option> <option value="machinery">machinery</option> <option value="manufacturing">manufacturing</option> <option value="media">media</option> <option value="not profit">not profit</option> <option value="recreation">recreation</option> <option value="retail">retail</option> <option value="shipping">shipping</option> <option value="technology">technology</option> <option value="telecommunications">telecommunications</option> <option value="transportation">transportation</option> <option value="utilities">utilities</option> <option value="other">other</option> </select> <label for=annual revenue:>annual revenue:</label> <input name="annual_revenue" type="varchar" group="" calculated="false" len="100" /> <label for=employees:>employees:</label> <input name="employees" type="varchar" group="" calculated="false" len="10" /> <label for=sic code:>sic code:</label> <input name="sic_code" type="varchar" group="" calculated="false" len="10" /> <label for=ticker symbol:>ticker symbol:</label> <input name="ticker_symbol" type="varchar" group="" calculated="false" len="10" /> <label for=ownership:>ownership:</label> <input name="ownership" type="varchar" group="" calculated="false" len="100" /> <label for=rating:>rating:</label> <input name="rating" type="varchar" group="" calculated="false" len="100" /> <input id="mybutton" type="submit" title="submit" value="submit" /> </form>

try http://jsfiddle.net/9lnpb/1/

$( 'input' ).wrap( "<div class='ui-input-text ui-body-inherit ui-corner-all ui-shadow-inset ui-input-has-clear'></div>" ); var divs = $("label , .ui-input-text"); for(var = 0; < divs.length; i+=2) { divs.slice(i, i+2).wrapall("<li class='ui-field-contain ui-li-static ui-body-inherit'>"); }

input

<label>hi</label> <input type="text">

output

<li class="ui-field-contain ui-li-static ui-body-inherit"> <label>hi</label> <div class="ui-input-text ui-body-inherit ui-corner-all ui-shadow-inset ui-input-has-clear"> <input type="text"> </div> </li>

jquery html css