0

I have written as

<div id="sample">
....
....
<a class="uploadedfiles" href="www.google.com">File</a>
.....
.....
<div class="diagram"></div>
.....
.....
.....      
</div>

Now I want the anchor tag with class uploaded files should be appended to the div with class diagram by jQuery The output should be as

<div class="diagram"><a href="www.google.com">File</a></div>

5 Answers5

1

Or simply

$('.diagram').append($('.uploadedfiles').removeAttr('class'))

If you have many link to append to diagram div you could use

$('.uploadedfiles').each(function(){
    $(this).appendTo('.diagram').removeAttr('class')
})
Devima
  • 1,566
  • 2
  • 10
  • 16
0
document.getElementsByClassName("diagram")[0].innerHTML+='<a href="www.google.com">File</a>';
nicael
  • 18,550
  • 13
  • 57
  • 90
0

OK..

Are you asking for something like that?

<div id="sample">

<a class="uploadedfiles" href="www.google.com">File</a>

<div class="diagram"></div>

</div>

CSS

.diagram { width:100px;height:100px;border:1px solid #000000;}

JS

$(document).ready(function(){

    var url = $('.uploadedfiles').attr('href');

    $('.diagram').append('<a href="'+url+'">File</a>');

    $('.uploadedfiles').remove();

});

Fiddle:

Check this

Shail Paras
  • 1,125
  • 1
  • 14
  • 34
  • 1
    This is right but I want jquery which will append the anchor tag on the basis of class name "uploadedfiles" not statically like .append(" –  Jun 08 '14 at 08:07
  • Using jQuery and `onclick` attribute? – Ram Jun 08 '14 at 08:22
  • Glad To Hear That : `this still doesn't answer the question`. Let him decide what he wants to do. – Shail Paras Jun 08 '14 at 08:30
0

I would recommend you something like this:

var diagram=document.getElementsByClassName('diagram')[0];
var uploadedfiles=document.getElementsByClassName('uploadedfiles');
var l=uploadedfiles.length;
for(var i=0;i<l;i++){
diagram.innerHTML+=uploadedfiles[i].outerHTML;
uploadedfiles[i].parentNode.removeChild(uploadedfiles[i]);
}

This code deletes every node with class 'uploadedfiles' and adds it into the 'diagram' node.

Edit: sorry, didn't notice you wanted jQuery code. I rather like the pure js-coding, so I can't help you with jQuery. But I think the other answers are correct. This code can be helpfull for those who don't use jQuery or any other js-library ;)

user1176420
  • 113
  • 2
  • 9
0

Its easy, you just need to search by starting word uploader for each anchor.

Below are the codes:

HTML: 

<div id="sample">

<a class="uploadedfiles" href="www.google.com">File</a>
<div class="diagram"></div>

</div>

JS:

$("a[class^='uploaded']").appendTo('.diagram');

Here you go: http://jsfiddle.net/PLNH8/

Thanks, Ashok

Ashok Kumar Gupta
  • 984
  • 7
  • 9