Am i wrong or is this a bug?


#1


https://www.codecademy.com/courses/web-beginner-en-v6phg/0/4?curriculum_id=50a3fad8c7a770b5fd0007a1

Oops, try again. It looks like you didn't add a

after the

with ID #two.


var $parag=$("p");
$('#one').after($parag);

var $div_two=$("#two");

$("#two").after($parag);


#2

This is an empty node list. There are no paragraph elements in the document at load time.

First we should consider what effect we are aiming for. We have two DIV elements, each with an ID. We want to first insert a P element after the first div, then remove it and insert after the second div.

$('#one').after( ... );

Without using a predefined object, we can write a paragraph tag into a string and replace the ....

'<p>Hello world!</p>'

In the second line (run the code with just the first, to start) we will target that paragraph with a jQuery selector.

$('#two').after($('p'));

We have targeted the only paragraph in the page, and moved it to a now location in the DOM.

That is the simplest form of this exercise. Study it closely, and ask if there is something you do not understand. Then we can move forward to your code.


#3

so i need to create a

tag first before assigning it to a variable...?


#4

If you do not want to write it directly in the statement, then, yes. Create it, store it and then insert it.

var p = '<p>Hello world!</p>'

Note that this is an element, but not a jQuery object. Witness what happens when we do this...

$('#one').after(p);
$('#two').after(p);

To get the same effect as above, we still need the jQuery selector in the second statement.

$('#one').after(p);
$('#two').after($('p'));

Now if that is absorbed, we can go into your attempt, and get it working with jQuery magic.

$p = $('<p/>').text("Hello World!");

We have created an element node that is transient in memory until such time as the variable reference changes. Permanent if that variable is never changed. The node is an ojbect in memory, and not yet in the DOM. What's cool about it is that it is a sprite object, meaning we can move it around and modify it all we want during the session. It can be removed from the page and reinserted on the fly, at any time.

$('#one').after($p);
$p.text("The world is moving!");
$('#two').after($p);

#5

i ran this code, but it still gave same error
var p = '

Hello world!

'
$('#one').after(p);
$('#two').after(p);

#6

With this code,

    var p = "<p>Hello World!</p>"
    $('#one').after(p); 
    $('#two').after(p);

I get this output in the console...

Div #1

Hello World!
Div #2

Hello World!

Yes, it should raise a lesson error because it does not move the element from one place to the other.

To do that, we need to implement the jQuery selector in the second line. p is a paragraph element in memory, and not a jQuery object. Its variable reference is forgotten when the literal element is inserted in the DOM.


#7

This topic was automatically closed 7 days after the last reply. New replies are no longer allowed.