<<  May 2012  >>
MoTuWeThFrSaSu
30123456
78910111213
14151617181920
21222324252627
28293031123
45678910

Moving HTML Elements Using jQuery

by Tim 7. July 2010 13:31

I had a piece of dynamic code in an ASP.NET usercontrol that I needed to move into another usercontrol. Ah, this should be easy I thought as I got to work on some simple JavaScript - I will use innerHTML and the result will be that the code (a list of items) will be placed where I want it on the page. This would save time reworking the two usercontrols for a while and give me some breathing space. Sure enough, the list looked as though it was coming from a different usercontrol when viewed in Firefox - with great anticipation, I opened up IE and....

Yeah, you guessed it - IE doesn't respond well to innerHTML annd the result was that the list stayed put.

Hmmm, there must be a way of doing this using jQuery I thought. I did some research and eventually came up with a fantastic transportation method:

 

$(document).ready(function() {

$("#divSimBullets").html($("#divBullets").html());

});

 

All HTML in the container 'divBullets' has now moved into the container 'divSimBullets'. Of course, the movement takes place on document ready but it should be so quick that you don't notice it.

The next day I set to work on the usercontrols but thought I'd record this handy function as a little reminder.

Comments are closed