Анимация появления текста Jquery

$("#button").hover( 
function () { 
if ($("#text").text() == 'TEXT2 TEXT2 TEXT2') { 
		$("#text").text('TEXT2 TEXT2 TEXT2') 
	} else { 
    $('#text').stop().css('opacity', '0').html(function (_, text) {  
        return text = 'TEXT2 TEXT2 TEXT2' 
    }).animate({ 
        opacity: 1  
    }, 2000); 
    } 
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> 
<button id="button">Наведи</button> 
<div id="text">TEXT1 TEXT1 TEXT1</div>

$("#button").hover( 
function () { 
    $('#text').stop().css('opacity', '0').html(function (_, text) {  
        return text = 'TEXT2 TEXT2 TEXT2' 
    }).animate({ 
        opacity: 1  
    }, 2000); 
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> 
<button id="button">Наведи</button> 
<div id="text">TEXT1 TEXT1 TEXT1</div>

$("#button").hover( 
function () { 
    $('#text').stop().css('opacity', '0').html(function (_, text) {  
        return text == 'TEXT1 TEXT1 TEXT1' ? 'TEXT2 TEXT2 TEXT2' : 'TEXT1 TEXT1 TEXT1' 
    }).animate({ 
        opacity: 1  
    }, 2000); 
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> 
<button id="button">Наведи</button> 
<div id="text">TEXT1 TEXT1 TEXT1</div>

$(function() { 
    $("#button").hover(function () { 
        $("#text").animate({opacity: 'toggle'}, 'slow').text("text1");;  
    });    
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> 
<button id="button">Наведи</button> 
<div id="text"></div>