CODEWITHSUNDEEP
jqueryhtmljquery-ui
Rashmi
Rashmi

Reputation: 551

Jquery Html getiing contents

I have some issue with jquery. i have some

tags after each ul li closed

i want to pick content of particular p tag when it's li has been clicked

Here in my HTML 

<div class="content">
      <p><span style="color: #d10018; font-family: Helvetica, Arial, sans-serif; font-size: 15pt; line-height: normal; text-align: left; background-color: #ffffff;">VALUES CREATE TRUST</span></p>
<h1><span style="font-size: 9pt;">From customer </span></h1>
<ul>
<li>Appreciations</li>
</ul>
<p style="margin-left: .75in;" class="ulptag">Your company culture is our groundwork. We select the candidates according to professional, objective criteria, but also pay attention that every candidate supplements the company/team best possible. Because pleasure at work increases the life quality of every individual.</p>
<p style="margin-left: .75in;" class="ulptag">With personal contact, we ensure that the special needs of our customers are fulfilled precisely.</p>
<p style="margin-left: .75in;" class="ulptag">Everybody benefits from our selection process. Candidates receive a comprehensive feedback with the results of the potential diagnostics. You as a company benefit from the appreciative handling of every candidate.</p>
<p>&nbsp;</p>
<ul>
<li>Structured procedure for enjoying mutual success.</li>
</ul>
<p style="margin-left: .75in;" class="ulptag"> successful decisions.</p>
<p style="margin-left: .75in;" class="ulptag">position.</p>
<p style="margin-left: .75in;" class="ulptag">every position.</p>
<p>&nbsp;</p>
<ul>
<li>Using innovations.</li>
</ul>
<p style="margin-left: .75in;" class="ulptag".n high demand also among competitors.</p>
<p style="margin-left: .75in;" class="ulptag">Advantage is assured by well-founded branch experience and knowledge of current developments in the respective markets.</p>
<p style="margin-left: .75in;">. our above-average dedication and effort.</p>


<p style="margin-left: .75in;" class="ulptag">&nbsp;</p>
    </div>

Thanks in Advance

Upvotes: 0

Views: 51

Answers (2)

prashanth
prashanth

Reputation: 2099

$(".content>ul").each(function() {
  $(this).click(function() {            
     console.log($(this).nextUntil(":not(p)").text());
  });
});

jsFiddle

UPDATE: Here is the explanation

  • $(".content>ul") will pick all "ul" elem.s and assign click event handlers.
  • In each event handler, we pick all the 'following' siblings 'until' a non-p element is found by using this selector ":not(p)". See nextUntil, not
  • After we pick the siblings, we just extract the text out of them.

Upvotes: 1

Mihai Matei
Mihai Matei

Reputation: 24276

$(document).ready(function(){
    $("ul").nextAll('p').each(function(){
         $(this).click(function(){
              alert($(this).text());
         });
    });
});

Please check out this http://jsfiddle.net/UMquF/

Upvotes: 1

Related Questions