Is this xss (or other) considered a vulnerability?

Question

AJAX

Hello.
There is a div where, for example, the username is displayed. There is an input in which we can change the username and this div should change on the page. such an ajax request

<div class="user_name">Ivan</div>

<input type="text" class="user-name-input">

$(document).on('click', '.change-user-name', function(){

    var user_name = $('.user-name-input').val();
  
    $.ajax({
        url: '/core/action/path/file.php',
        type: 'POST',
        data: {
            user_name: user_name 
        },
        dataType: 'json',
        success: (data)=> {
            $('.user_name').html(user_name );
        }
    });
});

In the success body, I insert into the div what I received from the input, and not what came from the back. there are reasons for this, the example here is simplified, but it will not work to paint everything. So, if the user writes to the input, for example, then it will be executed. Of course, if you refresh the page, then the div name is loaded from the back in a cleared form and js no longer processes it. It is possible to use not .html () for an insertion; and .text(), but in my case it is html that is needed. Is there a risk of xss and other vulnerabilities here? Thanks <script>alert('h');</script>

Answer 1

Try this: In theory, this will not lead to the execution of the script.
$('.user_name')[0].innerHTML = user_name;