Sélectionner une entrée cachée dans le td suivant [jQuery]

Question

J'ai une table disposée comme suit :

        <td>
                somename
        </td>
        <td class="hoverable value" >
                somevalue
        </td>
        <td class="changed">

        </td>
        <td class="original value">
            <input type="hidden" value="somevalue" />
        </td>

Et ce que j'essaie de faire, c'est de survoler le td survolable, ce qui le transforme en boîte de texte. Une fois que j'ai survolé, je veux vérifier la valeur originale du champ caché et mettre une image dans le champ modifié si les deux sont différents l'un de l'autre. Je l'ai déjà fait :

$(document).ready( function() {
    var newHTML = '';

    $('table td.hoverable').hover(
    function () {
        var oldHTML = $(this).html().trim();
        $(this).html('<input type=\'text\' value=\'' + oldHTML + '\' size=\'' + ((oldHTML).length + 2) +'\' />');
    },
    function() {
        newHTML = $('input', this).val();
        var oldHTML = $(this).next('td.original').children('hidden').val();
       if(newHTML != oldHTML) {
            $(this).next('td.changed').html('Changed');
        }
        $(this).html(newHTML);
    })
});

mais cela ne fonctionne pas. Ce qui échoue apparemment, c'est de saisir la valeur du champ caché, et j'ai essayé de le sélectionner de plusieurs façons différentes, mais je n'y arrive pas. Toute idée ou conseil est le bienvenu ;)

Answer 1

Vous devez utiliser .nextAll()

var oldHTML = $(this).nextAll('td.original').find('input:hidden').val();

Pourquoi ? Parce que .next() prend l'élément suivant et vérifie s'il correspond au sélecteur. Si vous utilisez .nextAll() vous obtenez l'élément suivant qui correspond au sélecteur.

Answer 2

Essayer

$(this).next('td.original').find('input:hidden').val();

Answer 3

var oldHTML = $(this).next('td.original').children(':hidden').val();

Answer 4

Remplacer

var oldHTML = $(this).next('td.original').children('hidden').val();

Avec

var oldHTML = $(this).next('td.original').find('input:hidden').val();