How to open up existing fancybox 3 image on td click

Question

I want to open up either picture a or b (if available) with fancybox 3 from any td without a certain class. The pictures should be shown as they are when clicking on the button.

I have included bootstrap, fancybox and jquery. Also i use icons from material icons. Fancybox works perfectly when opening from button.

<table>
    <tbody>
         <tr>
            <td style="cursor:pointer" id="abc">
                abc
            </td>
            <td style="cursor:pointer" id="def">
                def
            </td>
            <td  class="1234">
                 <div class="btn-group float-right" role="group"style="display:flex;">
                    <#if a??>
                        <a type="button" class="btn btn-secondary btn-sm" 
                           data-fancybox="test" data-type="image" 
                           data-thumb="${a}" data caption="abc" rel="group"
                           href="${a}" title="View browser screenshot">
                            <i class="material-icons md-14" 
                               aria hidden="true">photo_camera</i>
                        </a>
                    </#if>
                    <#if b??>
                        <a type="button" class="btn btn-secondary btn-sm" 
                           data-fancybox="test" data-type="image" 
                           data-thumb="${a}" data caption="abc" 
                           rel="group" href="${a}" 
                           title="View browser screenshot">
                            <i class="material-icons md-14" 
                               aria-hidden="true">remove_red_eye</i>
                        </a>
                    </#if>`
                </div>
            </td>
        </tr>
    </tbody>
</table>

I tried this jquery code: (Solution for another fancybox question on SO)

$(".table > tbody > tr > td").bind('click',function(e) {
            e.stopPropagation();
            if (!$(this).hasClass("1234")) {
                $(this).find("a").trigger('click');
            }
        });

and (obviously for tr insted of td)

$('.table > tbody > tr').click(function () {
            $(this).addClass('active').siblings().removeClass('active');
        });

and

$(document).ready(function(){
$('td').on('click', function() {
                if (!$(this).hasClass("1234")) {
                    $.fancybox();
                }
            });
        });

Answer 1

If some body is interested in the way i found a solution:

$(document).ready(function(){
            $(".table > tbody > tr > td").bind('click',function(e) {
                var name = $(this).attr('name');
                e.stopPropagation();
                if (!$(this).hasClass("1234")) {
                    $("#" + name).find("a:first").trigger('click');
                }
            });
});