How to get text sibling of element using jQuery?

Question

I am scraping a site and I found this

<table>
  <tr>
    <td>
      <b>Status:</b>ACTIVE;
      <b>Type:</b>CN - CONSTRUCTION
      <b>Added:</b>02/24/2012
    </td>
  </tr>
</table>

How do I get status, type, and added individually?

I know I will get downvotes because I am not posting any TRIED CODE... but I cant even seem to think what to try!

This website has POOR HTML structure and I cant seem to find any way.

sorry, ignore that ... that is confusing ... I removed that from question ... now please see my questoin again. — Umair Ayub
– Umair Ayub, Commented Aug 30, 2016 at 17:38
I am on mobile so cannot post a solution as it's difficult to type code. I would give a basic idea. Take the td innerHtml now split this string by  you will end up with Status:ACTIVE; as 0 index and Type:CN - CONSTRUCTION as index 1 etc.. now go ahead and split each one of this by  and now from the result the string at index 1 must be your required value — Rajshekar Reddy
– Rajshekar Reddy, Commented Aug 30, 2016 at 17:39
Also you can use regex for this kind of logic. You can just run the regex against the innerHtml to match all the text between  and  .. this will give you array of matches and all of them are the required data — Rajshekar Reddy
– Rajshekar Reddy, Commented Aug 30, 2016 at 17:48

Rayon · Accepted Answer · 2016-08-30 17:39:14Z

2

Use jQueryElement.text() to grab all the text.
Use String#spplit to split the string

var text = $('#content').text();
var split = text.trim().split('\n');
split.forEach(function(el) {
  var splitAgain = el.split(':');
  console.log("Key:  " + splitAgain[0].trim() + "   Value:  " + splitAgain[1].trim());
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<table>
  <tr>
    <td id="content">
      <b>Status:</b>ACTIVE;
      <b>Type:</b>CN - CONSTRUCTION
      <b>Added:</b>02/24/2012
    </td>
  </tr>
</table>

answered Aug 30, 2016 at 17:39

Rayon

36.6k5 gold badges54 silver badges78 bronze badges

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

Comments

Mohammad · Accepted Answer · 2016-08-30 17:50:46Z

1

Javascript nextSibling property get next text sibling of element. You can select b elements in td and get next text of it.

$("td > b").each(function(){	
    console.log(this.innerText +" = "+ this.nextSibling.nodeValue.trim());
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table>
  <tr>
    <td>
      <b>Status:</b>ACTIVE;
      <b>Type:</b>CN - CONSTRUCTION
      <b>Added:</b>02/24/2012
    </td>
  </tr>
</table>

answered Aug 30, 2016 at 17:50

Mohammad

21.5k16 gold badges58 silver badges86 bronze badges

Collectives™ on Stack Overflow

How to get text sibling of element using jQuery?

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related