Skip to content Skip to sidebar Skip to footer

Re-arrange DOM Elements

I have the code below:

Solution 1:

Have you tried this approach?

var content = $('.grp-help').html();
$('.grp-help').remove();
$('.c-1').append('<span class="grp-help">' + content + '</span>');
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="grp-row grp-cells-1">
  <div class="l-2c-fluid l-d-4">
    <div class="c-1">
      <label for="sometext">Label</label>
    </div>
    <div class="c-2">
      <select id="sometext" name="somename">
        <option value="" selected="selected">Option</option>
      </select>
      <p class="grp-help">bla</p>
    </div>
  </div>
</div>

Solution 2:

To avoid duplication you should detach:

$element = $('span.grp-help');
$element.detach();
$element.appendTo('div.c-1');

Post a Comment for "Re-arrange DOM Elements"