Question

I am attempting to update a select box with jquery but instead of just replacing the <div> containing the select box. html() is replacing the entire <fieldset>. I have tried everything and can’t see where I’m going wrong here.

My jquery is:

$('div.companyselect', $(parent.document)).html(data.success);

My HTML is:

<fieldset>
    <legend>Company Information</legend>
    <div class="column-left">
      <label>Manufacturer Name:</label>
      <div class="companyselect"><?php echo $select ?><div>&nbsp;

      <a href="../forms/modal_company.php" class="various fancybox.ajax" style="font-size:12px;">Add a Company</a>

    </div>
    <div class="clear"></div>  
 </fieldset>
 <fieldset>
    <legend>Vendor Information</legend>
    <div class="column-left">
      <label>First Name</label>
      <input name="name" class="text-input medium4-input required" type="text" id="name" value="">
    </div>
    <div class="column-right medium_margin">
      <label>Last Name:</label>
      <input name="last" class="text-input medium4-input required" type="text" id="last" value="">
    </div>
    <div class="clear"></div>
    <div>    
      <label>Address:</label>
      <input name="address" class="text-input medium2-input required" type="text" id="address" value=""> 
    </div>  
    <div class="clear"></div> 
    <div class="column-left" style="width:52%">
      <label>City:</label>
      <input name="city" class="text-input medium3-input required" type="text" id="city" value="" >
    </div>
    <div class="column-left" style="width:15%">
      <label>State:</label>
      <input name="state" class="text-input small-input required" type="text" id="state" value="">
    </div>
    <div class="column-left" style="width:30%">
      <label>Zipcode:</label>
      <input name="zipcode" class="text-input medium5-input required" type="text" id="zipcode" value="" >
    </div>
    <div class="clear"></div>
    <div class="column-left medium_margin">
      <label>Phone:</label>
      <input name="tel" class="text-input medium-input required" type="text" id="tel" value="">
    </div>
    <div class="column-right medium_margin">
      <label>(optional) Fax:</label>
      <input name="fax" class="text-input medium-input" type="text" id="fax" value="">
    </div>
    <div class="clear"></div> 
  </fieldset>

Can someone help me understand why the entire first is being replaced instead of just the with class=”companyselect”??

Answer 1

Most likely due to broken HTML:

<div class="companyselect"><?php echo $select ?><div>&nbsp;

Should be:

<div class="companyselect"><?php echo $select ?></div>&nbsp;