CODEWITHSUNDEEP
javascriptjqueryimageclasshtml
HackToHell
HackToHell

Reputation: 2393

Inserting a code block after a div tag using JQuery?

I am a Javascript noob and I need help adding a codeblock after a div.

i want to add code after the following class

<div class='post-body entry-content'>

So mu JQuery code must be 

$('post-body entry-content').add('<img border="0" src="http://4.bp.blogspot.com/-C4vvMEB9MyI/TfW0lduV2NI/AAAAAAAAAZc/N7HL1pUusGw/s1600/some image.png" />');

Right ??

If I am wrong please correct me !

Upvotes: 0

Views: 2848

Answers (4)

rahul
rahul

Reputation: 187030

You can insert the code block inside the document ready event.

$(function(){
    $('div.post-body.entry-content').after('<img border="0" src="http://4.bp.blogspot.com/-C4vvMEB9MyI/TfW0lduV2NI/AAAAAAAAAZc/N7HL1pUusGw/s1600/some image.png" />');
});

Upvotes: 1

Salman Arshad
Salman Arshad

Reputation: 272106

Depending on what you want:

// inside, before all existing content
$(".post-body.entry-content").prepend('<img src="some image.png" />');

// inside, after all existing content
$(".post-body.entry-content").append('<img src="some image.png" />');

// outside, after
$(".post-body.entry-content").after('<img src="some image.png" />');

Demo here.

Upvotes: 1

alex
alex

Reputation: 490213

No, that is incorrect.

  • Use the . to select by class and join them together if you want to match elements which include all classes.
  • To make the image come after, use after().
  • Also make sure this code is executed after the element exists. Best way to do that is wrap it with the DOM ready event.
$(function() {

    $('.post-body.entry-content')
       .after('<img border="0" src="http://4.bp.blogspot.com/-C4vvMEB9MyI/TfW0lduV2NI/AAAAAAAAAZc/N7HL1pUusGw/s1600/some image.png" />');

});

Upvotes: 1

ThiefMaster
ThiefMaster

Reputation: 318498

Use .after() to insert something after a certain element.

Upvotes: 1

Related Questions