simple jquery...doing nothing...

Hi guys...I am really getting frustrated with this. In my theme I have a script file that is working. I am adding a new function to deal with some div but nothing happen. Cleared the cache...tried different things...nothing is working.

The following code is working perfectly fine when tested in jsfiddle, but in my site...nothing at all.

html code output:

<div class="cal-full">
<a href="/race/charlton-park-winter-monster-race-10k-2016-11-12">title</a>
</div>
<div id="cal-events-tooltip-4734" class="cal-events-tooltip cal-events-tooltip_hide">
   <h4 class="cal-entry-title summary"><a href="/race/event">title</a></h4>
   <div class="cal-event-body">
      <div class="cal-event-thumb">
      logo
      </div>
       <div class="cal-event-description"><p>dsfdsfsdfsdfsdfsdfsdfdfs</p></div>	
      <span class="tribe-events-arrow"></span>
   </div>
</div>

in my js script:

$(document).ready(function () {

	$(".cal-full").mouseover(function() {

		    $(this).siblings('.cal-events-tooltip').addClass('cal-events-tooltip_show');
        $(this).siblings('.cal-events-tooltip').removeClass('cal-events-tooltip_hide');
        
		});
    
    $(".cal-full").mouseout(function() {

		    $(this).siblings('.cal-events-tooltip').removeClass('cal-events-tooltip_show');
        $(this).siblings('.cal-events-tooltip').addClass('cal-events-tooltip_hide');

		});

});

Any help will be appreciated.
Thanks!