jQuery обработчик клика с .toggle() не работает с datatables

Question

У меня есть некоторые datatables внутри divs, и я хочу «.toggle()» таблицы, чтобы скрыть или показать их, нажав на изображение (которое работает). После инициализации datatables мой обработчик кликов все равно срабатывает каждый раз, но $ (this) является правильным только для последнего элемента. На каждом другом элементе $ (this) есть «prevObject», который не работает с .toggle().

<div class='toggle'> 
    <img src='/some/path/foo.jpg'> 
    <table class='dt'> 
    ... 
    </table> 
</div> 
<div class='toggle'> 
    <img src='/some/path/foo.jpg'> 
    <table class='dt'> 
    ... 
    </table> 
</div> 
<div class='toggle'> 
    <img src='/some/path/foo.jpg'> 
    <table class='dt'> 
    ... 
    </table> 
</div> 

//This works if I don't initialize datatables 
$(".toggle").on("click", "img", function(event) { 
    $(this).siblings(".dt").toggle(); 
}); 

Любая идея, что происходит с $ (этим)?

EDIT: Селектор jQuery «$ (this)» выше работает отлично, если данные не инициализируются. После инициализации «$ (this)» возвращает «prevObject» на всех, но один из элементов. Поэтому один элемент работает правильно при нажатии, а все остальное - нет.

EDIT2: Вот jsfiddle, чтобы проиллюстрировать эту проблему: http://jsfiddle.net/S6bhL/10/

EDIT3: В моем фактическом приложение, которое я должен был в конечном итоге с использованием раствора ниже со следующими изменениями:

$(this).parent().parent().find(".dt"); 
$(this).parent().parent().find(".dataTables_wrapper"); 

Answer 1

EDIT: С OP обновил вопрос, вот мой обновленный ответ.

UPDATED JSFIDDLE DEMO

Похоже, каждый раз, когда вы щелкаете Инициализировать DataTables, она заворачивают на DIV dataTables_wrapper. Таким образом, обработка обоих случаев.

$(document).ready(function() { 

    $(".toggle").on("click", "img", function (event) { 
     var $nextDT = $(this).next('.dt'); 
     var $nextDTWrap = $(this).next('.dataTables_wrapper'); 

     if ($nextDT.length) { 
      $nextDT.toggle(); 
     } else if ($nextDTWrap.length) { 
      $nextDTWrap.toggle(); 
     } 
    }); 
}); 

function doit() { 
    $(".dt").each(function() { 
     $(this).dataTable(); 
    }); 
}