Comment ajouter div et ajouter une classe où div id est identique à la valeur td avec jquery?

Question

J'ai les deux HTML suivants qui sont générés par PHP.

Je veux ajouter le second à la première table td. Je veux ajouter class = "date_has_event" à td s'il y a des événements. Chaque événement a un numéro qui est la date dans div id. J'utilise jquery, mais je ne suis pas sûr. Quelqu'un pourrait-il me dire comment aborder celui-ci s'il vous plaît?

HTML

<tr> 
<td>17</td><td><div class="highlight">18</div></td><td>19</td><td>20</td> 
<td>21</td><td>22</td><td>23</td> 
</tr> 

DIV Je veux ajouter au code HTML ci-dessus.

--UPDATE--

Le suivant est généré dynamiquement par PHP/MYSQL. Ce sont des listes d'événements. 17 div doit être annexée à td est 17 et 19 div td 19 etc.

<div id ="17" class="events"> 
    <ul style="opacity: 0; top: 
20px; left: -76px; display: none; bottom: -202px;"> 
     <li><a href="index.php/admin 
/calendar/edit/1"> 
     <span class="title">17th event 1</span> 
     <span class="desc">event 1 of 17th</span></a> 
     </li> 
     <li><a href="index.php/admin/calendar/edit/4"> 
     <span class="title">17th event 2</span> 
     <span class="desc">event 2 of 17th</span></a> 
     </li> 
     <li><a href="index.php/admin/calendar/edit/13"> 
     <span class="title">make pancake with 
emile</span> 
     <span class="desc">mix flour, water and raindrops with love</span></a> 
     </li> 
    </ul> 
    </div> 


    <div id="19" class="events"> 
    <ul style="opacity: 0;"> 
     <li><a href="index.php/admin/calendar/edit/2"> 
     <span class="title">19th event 1</span> 
     <span class="desc">id 2 change</span> 
</a></li> 
     <li><a href="index.php/admin/calendar/edit/5"> 
     <span class="title">19th event 2</span> 
     <span class="desc">event 2 of 19th</span></a> 
     </li> 
     <li><a href="index.php/admin/calendar/edit/6"> 
     <span class="title">19th event 3</span> 
     <span class="desc">event 3 of 19th</span></a> 
     </li> 
    </ul> 
</div> 
    ... 
    ... 

La sortie finale que je veux avoir.

<tr> 
    <td class="date_has_event"> 17<div class="events"> 
    <ul style="opacity: 0; top: 
20px; left: -76px; display: none; bottom: -202px;"> 
     <li><a href="index.php/admin 
/calendar/edit/1"> 
     <span class="title">17th event 1</span> 
     <span class="desc">event 1 of 17th</span></a> 
     </li> 
     <li><a href="index.php/admin/calendar/edit/4"> 
     <span class="title">17th event 2</span> 
     <span class="desc">event 2 of 17th</span></a> 
     </li> 
     <li><a href="index.php/admin/calendar/edit/13"> 
     <span class="title">make pancake with 
emile</span> 
     <span class="desc">mix flour, water and raindrops with love</span></a> 
     </li> 
    </ul> 
    </div> 
</td> 
<td id="today"> 18</td><td class="date_has_event"> 19<div 
class="events"> 
    <ul style="opacity: 0;"> 
     <li><a href="index.php/admin/calendar 
/edit/2"> 
     <span class="title">19th event 1</span> 
     <span class="desc">id 2 change</span> 
</a></li> 
     <li><a href="index.php/admin/calendar/edit/5"> 
     <span class="title">19th event 2</span> 
     <span class="desc">event 2 of 19th</span></a> 
     </li> 
     <li><a href="index.php/admin/calendar/edit/6"> 
     <span class="title">19th event 3</span> 
     <span class="desc">event 3 of 19th</span></a> 
     </li> 
    </ul> 
</div> 
</td> 
<td> 20</td><td> 21</td><td> 22</td><td> 
23</td></tr> 

Answer 1

Essayez quelque chose comme ceci:

if ($('div[@id]') == $(td).html()) 
{ 
    $('somediv').html('<div>whatever</div>') 
    $('somediv').addClass('classname'); 
} 

Dans le code ci-dessus, vous devez spécifier des identificateurs corrects div et td.

Answer 2

Considérer vos cellules td ont une classe my_td. SMTH Peut-être comme:

$(document).ready(function(){ 
    $('.my_td').each(function(){ 
     var div_id = $(this).text(); 
     var matched_div = $('div#'+div_id); 
     if(matched_div.children('ul li').length){ 
     $(this).addClass = 'date_has_event'; 
     $(this).append(matched_div) 
     } 
    }); 
}); 

Non testé, mais je voulais juste montrer idée comment vous pouvez résoudre votre problème.

Answer 3

Essayez:

$('#mytable td').each (function() 
{ 
    var cell = $(this), div = $('#' + cell.text()); 
    if (div.length) 
     cell 
     .addClass ('date_has_events') 
     .append (div); 
}); 

Remplacer #mytable avec identifiant de votre table