Get CSS text inside <td> using jQuery

Question

I have a table like this:

<table id="orders"> <tr> <td>05/06/2005</td> <td>3216549</td> <td>description</td> <td>2.000,00</td> <td>100</td> <td>20,00</td> <td><div id="state" class="state-c"> </div></td> <td><a href="modify.php?id=222"><span class="bt-edit">EDIT</span></a></td> </tr> <table> 

the <div id="state" class="state-c"> </div> reports "Approved", "Rejected", etc. and CSS is generated:

 .state-c:before { content: "Confirmed"; } 

Now I need to get the text value of these table cells, whereas for all cells I successfully use the .text() method, it does not receive the text generated by the CSS “Verified”. I tried to use getGeneratedStyle , .value and searched for clock information but no luck.

My question is: how can I get the generated text inside <div id="state" class="state-c"> </div> , which is actually empty if you look at the code?

Answer 1

You can get it as after using window.getComputedStyle .

 var text = window.getComputedStyle($('#state')[0], ':before').content alert(text) 

 .state-c:before { content: "Confirmed"; } 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <table id="orders"> <tr> <td>05/06/2005</td> <td>3216549</td> <td>description</td> <td>2.000,00</td> <td>100</td> <td>20,00</td> <td><div id="state" class="state-c"> </div></td> <td><a href="modify.php?id=222"><span class="bt-edit">EDIT</span></a></td> </tr> <table> 

Answer 2

 var s = '.state-c:before { content: "Confirmed";}'; var m = s.match(/"(.*?)"/); alert(m[1]); // m[1] = quoted 

just pass css as a string and get the text inside double quotes. hope this helps you

Answer 3

Perhaps you can try .find ("# state"). text ("my text")