Add Div after existing Hidden Div using Jquery

Question

I have a div #fancybox-content that's hidden, until a thumbnail is clicked then that div pop ups.

I want to add another DIV #video-desc after #fancybox-content so the contents of #video-desc shows under it when it pops up.

I have this code

<script type='text/javascript'>
jQuery(document).ready(function($){
$('#video-desc').insertAfter('#fancybox-content')
});
</script>

it doesnt seem to be working though, it this because the div is hidden? how would i only trigger this event after #fancybox-content is visible?

What do you mean by "I want to add another DIV" ? you want to make a copy of it? or add a new element with that ID? — Sergio
– Sergio, Commented Oct 13, 2013 at 20:43
Why don't you add the code that displays #video-desc to go where you have your handler that turns #fancy-box-content visible? i.e. $('#fancybox-content').show(); $('#video-desc').insertAfter('#fancybox-content'); — EmptyArsenal
– EmptyArsenal, Commented Oct 13, 2013 at 20:47
its to add a description below a fancybox pop up, i cant seem to find how to do that manually, so i just want to use jquery to pop it under there. — Shonna Edwards Martell
– Shonna Edwards Martell, Commented Oct 13, 2013 at 20:52
Sergio, i have 2 different divs with different content, I want to add one under the other — Shonna Edwards Martell
– Shonna Edwards Martell, Commented Oct 13, 2013 at 20:53

SCV · Accepted Answer · 2013-10-13 21:28:13Z

1

Try this?

if( $('#fancybox-content').is(':hidden') ) {
    //do nothing
}
else {
    $('#video-desc').insertAfter('#fancybox-content')
    //Or
    //$('#video-desc').show(); whatever         
}

update on 10/13/2013

Another approach:

Since your div is hidden, once the javascript get executed, It cannot find the hidden div.

Use display:none/block instead of hidden

change the '#fancybox-content' div's css field to display:none by

$('#fancybox-content').css("display", "none");

you can also write

$('#fancybox-content').css("display", "block");

to make it show.

edited Oct 13, 2013 at 21:28

answered Oct 13, 2013 at 20:49

SCV

4162 silver badges14 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Shonna Edwards Martell Over a year ago

no error message in console. This is a fancybox that I have trying to add the div under (for description)

Collectives™ on Stack Overflow

Add Div after existing Hidden Div using Jquery

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related