1

I have to show a banner ad for each article somewhere in between the article text, let us say after 2nd or 3rd paragraph.

sample example of article on jsFiddle

if you have checked the jdFiddle then you can understand my scenario better, I want to ad the red banner box after second paragraph and i want to do it with jQuery i would appreciate if some one can help me with this.

I can do same in asp.net web form using c# by splitting the text at end of second paragraph & adding the Banner div.

I would love to have a solution which is more perfect for this kind of scenario

<div class="ArticleContent">
    <p>
        Lorem ipsum dolor sit amet, ut auctor mauris eget erat nonummy, non mauris risus libero voluptates cras, debitis elementum eget etiam. Class nisl, at euismod ligula nulla sodales, tristique nunc, justo pellentesque tempora. Lectus metus penatibus mi donec magna, sapien adipiscing magna sed, integer vitae.</p>

<p>Nam diam malesuada purus, fermentum commodo luctus laoreet quisque, pede eget conubia, conubia dui per sit a eu laoreet, eu massa. Donec in sem at, wisi ante sed non aptent, id facilis lorem ligula nec nullam, vestibulum elementum dolor natoque viverra dolor amet, aliquet eu lectus lectus suspendisse sodales nulla. Lacinia suscipit erat. </p>

<p>Tellus quam lectus pretium in montes tellus, mi nobis felis et tincidunt tempor adipiscing, consectetuer quia non dui odio nam, elit morbi elit laoreet nisl nibh. </p>

<p>Tincidunt lorem porta auctor, lobortis in molestie eu, volutpat a sapien donec vitae id, at enim.</p>
    <div class="ContentBanner"> BANNER WILL SHOW UP HERE</div>
</div>
4

3 回答 3

3

With jQuery you can use below code:

$('<div class="ContentBanner"> BANNER WILL SHOW UP HERE</div>').insertAfter('.ArticleContent p:nth-child(3) ');

This should work!!!!

http://jsfiddle.net/eehtK/

于 2012-10-31T10:30:04.737 回答
2 
$(".ContentBanner").insertAfter(".ArticleContent p:eq(1)")

DEMO

于 2012-10-31T10:30:45.160 回答
1 
$("div.ArticleContent p").each(function(index,item)
    {
        if(index==1 || index==2)
        {
            var divBanner='<div class="ContentBanner"> BANNER WILL SHOW UP HERE</div>';

            $(this).append(divBanner);
       }        
  });
于 2012-10-31T10:52:01.287 回答