在父母单击按钮后更改子项中的图标 - ajax

Question

我有一个包含主题和页面的可排序列表。

我想做以下事情：当我点击主题中的眼睛按钮时，主题和您的页面孩子将隐藏，更改他们的视图图标。也就是说，如果您更改主题上的图标，则会更改所有子项的图标。 例如：

目前我只能在主题中更改视图图标。如何更改子页面中的视图图标呢？

PHP代码：

//printing topic
    if($list[$i]->getObj()->getSTop_view() == 0){
        $view_icon = '<img id="imgEye" title="Hide" name="hide" src="/imgs/icons/ic_hide_16x16.png">';
    } else {
        $view_icon = '<img id="imgEye" title="Show" name="show" src="/imgs/icones/ic_show_16x16.png">';
    }

    $html.= '<li class="dd-item dd3-item" data-id="'.$list[$i]->getObj()->getTop_id().'" view-value="'.$list[$i]->getObj()->getTop_view().'">
                    <div class="dd-handle dd3-handle">'.$list[$i]->getObj()->getTop_name().'</div>
                    <div class="dd3-content">
                        <span style="font-weight: bold; font-size: 14px;">'.$list[$i]->getObj()->getTop_name().'</span>
                        <span class="span-right">
                            <a id="UpdateViewTop" name="'.$list[$i]->getObj()->getTop_id().'">'.$view_icon.'</a>
                            <a class="edit-button" href="..."><img title="Edit" src="/imgs/icons/ic_edit_16x16.png"></a>
                            <a class="del-button"><img title="Delete" src="/imgs/icons/ic_delete_16x16.png"></a>
                        </span> 
                    </div>';

    for($j=($i+1);$j < $cont_int;$j++) { //if the topic have children
//printing pages
        if($list[$j]->getObj()->getPag_view() == 0) {
            $view_icon = '<img id="imgEye" title="Hide" name="hide"  src="/imgs/icons/ic_hide_16x16.png">';
        } else {
            $view_icon = '<img id="imgEye" title="Show" name="show" src="/imgs/icones/ic_show_16x16.png">';
        }

        $html.= '<ol id="stopitem" class="dd-list">
                     <li id="pagstopitem" class="dd-item dd3-item" data-id="'.$list[$j]->getObj()->getPag_id().'" view-value="'.$list[$j]->getObj()->getPag_view().'">
                        <div class="dd-handle dd3-handle"></div>
                        <div class="dd3-content">
                            <span><a href="...">'.$list[$j]->getObj()->getPag_name().'</a></span>
                            <span class="span-right">
                                <a id="UpdateViewPag" name="'.$list[$j]->getObj()->getPag_id().'">'.$view_icon.'</a>
                                <a class="edit-button" href="..."><img title="Edit" src="/imgs/icons/ic_edit_16x16.png"></a>
                                <a class="delpagstop-button" name="'.$list[$j]->getObj()->getPag_id().'"><img title="Delete" src="/imgs/icons/ic_delete_16x16.png"></a>
                            </span>
                        </div>
                    </li>';
    ...
    }

Javascript和Ajax代码：

$(document).on('click', '#UpdateViewTop', function(e){

    e.preventDefault();

    var uid = $(this).attr('name');
    var img = $(this).children('#imgEye');
    var eye = img.attr('name');

    var myData_IC_hide = '/imgs/icons/ic_hide_16x16.png';
    var myData_IC_show = '/imgs/icons/ic_show_16x16.png';


    $.ajax({
        url: '/admin/control/ajax/view.php',
        type: 'POST',
        data: {id: uid},
        dataType: 'html',
        success: function() {
            //here change the icon in topic when I click in eye button
            //that's works fine!
            //Now I want to change the icon in page children

            if(eye == "show") {

                img.attr('src', myData_IC_hide);
                img.attr('name', 'hide');
                img.attr('title', 'Hide');

            } else if(eye == "hide") {

                img.attr('src', myData_IC_show);
                img.attr('name', 'show');
                img.attr('title', 'Show');

            }
        }
    });

});