How to trigger event only in the element in use - jQuery
<p><strong>IMPORTANT</strong></p>

<p>Solved this problem by modifying my actual code. The simplified code below should work as expected, by my actual code wasn't working since it was made with functions and a different layout, but I now realized I made a silly logic mistake.</p>

<hr>

<p>I tried to find this on google and haven't found and answer, I don't know if I'm not asking google properly, but what I want to achieve is something like this</p>

<p><strong>HTML:</strong></p>

<pre><code>&lt;div class="animates-whats-inside"&gt;
    &lt;h1&gt;This title will be animated when you put the cursor on my parent&lt;/h1&gt;
&lt;/div&gt;
&lt;div class="animates-whats-inside"&gt;
    &lt;h1&gt;This title will be animated when you put the cursor on my parent&lt;/h1&gt;
&lt;/div&gt;
</code></pre>

<p><strong>jQuery:</strong></p>

<pre><code>$('.animates-whats-inside').on('mouseenter', function() {
    $(this).children().find('h1').animate(...);
});
</code></pre>

<p><strong>EDITED DETAILS:</strong></p>

<p><em>I if I move the mouse inside the first div I want to move only the title inside the first div but not the one in the second div, and if I move the mouse inside the second div, move the title inside the second div but not the one inside the first</em>, right now it moves all the titles in the different sections. How can I achieve this? I'm sure this should be very simple, but I haven't been able to figure out how to search for this selector!</p>

<p>Thanks beforehand!</p>