CODEWITHSUNDEEP
jquery
klewis
klewis

Reputation: 8350

how to swap an element with jquery?

I have the following setup within my HTML document...

<div id="logo"><h2>my top logo</h2></div>
<div id="one"><p>this is the first section with stuff in it</p></div>
<div id="two"><h1>this is the section section with stuff in it</h1></div>
<script>//this script associates to stuff in div id=two</script>

Is there a way to tell < div id = one >, to go under the < script > tag this way it looks like this...

<div id="logo"><h2>my top logo</h2></div>
<div id="two"><h1>this is the section section with stuff in it</h1></div>
<script>//this script associates to stuff in div id=two</script>
<div id="one"><p>this is the first section with stuff in it</p></div>

I can't depend on a parent div element id that contains all these. I need to only depend on what you see right here.

Thanks

Upvotes: 0

Views: 116

Answers (5)

nbrooks
nbrooks

Reputation: 18233

$('#two').next('script').after( $('#one') );

Upvotes: 2

Axel
Axel

Reputation: 10772

You can do it like this

$("#one").insertAfter($('script'));

Given that is the only script tag in your code. You could implement further checks and balances to make sure it sits directly after the script tags you require.

Upvotes: 0

Ram
Ram

Reputation: 144689

Try this:

$('#two').next().after($('#one'))

Fiddle

Upvotes: 2

tom502
tom502

Reputation: 701

You can use the following to move them about

jQuery("#one").after(jQuery("#two"));

You can also use

jQuery("#two").before(jQuery("#one"));

Upvotes: 1

Kevin B
Kevin B

Reputation: 95022

You could do this, though I don't know what the purpose of doing this is. It shouldn't change anything about the layout of the page.

$("#one").insertAfter( $("#one").nextAll("script").eq(0) );

you should fix the html above, you have unopened p tags and unclosed h1 tags.

Upvotes: 2

Related Questions