CODEWITHSUNDEEP
javascriptjqueryhtmldom
JS-Hero
JS-Hero

Reputation: 317

change HTML element place to another place javascript

I want to take img.fnone and replace it under span.ddlabel element via JavaScript or jquery is there any function to do that 

  <span id="flat_title" class="ddTitleText ">
    <img class="fnone" src="images/pinc.png">
    <span class="ddlabel">A</span>
    <span class="description" style="display: none;"></span>
    </span>

Upvotes: 0

Views: 1716

Answers (4)

AAA
AAA

Reputation: 142

Use html()

var html=$("img.fnone").html();
$("span.ddlabel").html(html);
$("img.fnone").remove();

Upvotes: 0

Tom Chung
Tom Chung

Reputation: 1422

Make use of element.appendChild method.

<span id="flat_title" class="ddTitleText ">
    <img class="fnone" src="images/pinc.png" />
    <span class="ddlabel">A</span>
    <span class="description" style="display: none;"></span>
</span>
<div>
    <button id="abc">Click to replace</button>
</div>
<script>
document.getElementById('abc').addEventListener('click',function(){
    var parent = document.getElementById('flat_title'),
    img = document.getElementsByClassName('fnone')[0],
    description = document.getElementsByClassName('description')[0];

    parent.appendChild(img);
    parent.appendChild(description);
})
</script>

Check it on http://jsfiddle.net/fWK67/

Upvotes: 0

varun
varun

Reputation: 76

<script type="text/javascript">
    $(document).ready(function () {

        $('span .ddlabel').append('<img class="fnone" src="images/pinc.png">');
        $('#flat_title img:first').remove()

    });

</script>

Upvotes: 0

Murali Murugesan
Murali Murugesan

Reputation: 22619

Use append()

var targetSPAN=$('#flat_title');
var image=$('img.fnone', targetSPAN);

$('span.ddlabel', targetSPAN).append(image);

JSFIDDLE DEMO

Upvotes: 3

Related Questions