'Magneto add to cart success message

the problem is client wants to fadeout the success message after few seconds by clicking add to cart button. I have made a change in addCartSuccessMessage.phtml file like this:

<?php
/**
 * Copyright © Magento, Inc. All rights reserved.
 * See COPYING.txt for license details.
 */

/** @var \Magento\Framework\View\Element\Template $block */
?>

<?= $block->escapeHtml(__(
    'You added %1 to your <a href="%2">shopping cart</a>.',
    $block->getData('product_name'),
    $block->getData('cart_url')
), ['a']);

?>
<script type="text/javascript">

    require(['jquery'], function($){
        $(".message.success").fadeOut(7000);

    });
</script>

Now the problem is if i open up the site on mobile the notification shows up only one time and after that no matter how many times i click on add to cart button success message wont show up it shows up again only if i refresh the page



Sources

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

Source: Stack Overflow

Solution Source