'Laravel Tailwind CSS - Tooltip didn't get data, but parent div gets it

I've got a table with attendance, where I just pass specific color to div and id of attendance, but I didn't understand one thing: The id passed like <div id={{ attendance->id }}></div> works, but when I pass other data just one line lower like I did before it gets the latest even if I empty that var after use?

@for ($i = 1; $i <= 30; $i++ )
    @foreach ($user->attendances as $attendance)
        @php
            $temp = strtotime(Carbon\Carbon::parse(Carbon\Carbon::now())->startOfMonth()->setMonth(Carbon\Carbon::now()->month)->setDay($i)->format('Y-m-d'));  
            $start = strtotime(Carbon\Carbon::parse($attendance->start));
            $end = strtotime(Carbon\Carbon::parse($attendance->end));
        @endphp

        @if ($temp >= $start && $temp <= $end)
        @php
            $user->cell = $attendance->id;                                                 
            $user->style = $attendance->reasons->color;
        @endphp
        @endif
                                                                
    @endforeach

    <td class="border border-slate-600">
                                                                
    <div data-tooltip-target="tooltip-default" class="rounded-md {{ $user->style }} py-2 px-3" style="background-color: {{ $user->style }}" id="{{ $user->cell }}"> <!-- Here it gives right value to each div -->
        <div id="tooltip-default" role="tooltip" class="inline-block absolute invisible z-10 py-2 px-3 text-sm font-medium text-white bg-gray-900 rounded-lg shadow-sm opacity-0 transition-opacity duration-300 tooltip dark:bg-gray-700">
        ID attendance:{{ $user->cell }}<br> <!-- it gives the latest ID in DB. -->
        <div class="tooltip-arrow" data-popper-arrow></div>
        </div>
    </div>  
    </td>
    @php 
    $user->cell = ''; 
    $user->style = '';
    @endphp
@endfor

How to explain that? Is there better way to create tooltip to each div in table cell?

phplaravellaravel-blade


Solution 1:[1]

Update:

Overriding stylizations can cause be a pain. However, in the OP situation injecting a hex rgb value was not able to be injected in the class attribute.

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1

Related Questions