Jquery code didn't work inside Razor

Question

This code inside view in MVC4 where ViewData["Success"] contains bool value from controller and it's excecuted abd JavaScript alert worked correctly but

$("h4.alert_success").css('display', 'block').fadeOut(5000);

is not shown in the browser hint: this code:

$("h4.alert_success").css('display', 'block').fadeOut(5000);

worked correctly in another position inside the project

@if (ViewData["Success"] != null && (bool)ViewData["Success"]==true)
{
    <script type="text/javascript">
        alert("success");
        $("h4.alert_success").css('display', 'block').fadeOut(5000);
    </script>
}

Answer 1

Try to include jQuery library and add your code inside DOM ready handler $(document).ready(function() {....}) or shorter form $(function() {...});:

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>

<script type="text/javascript">
    $(function(){
        alert("success");
        $("h4.alert_success").css('display', 'block').fadeOut(5000);
    });
</script>

Answer 2

You need to defer execution until the DOM is ready:

<script type="text/javascript">
 $(function(){
    alert("success");
    $("h4.alert_success").css('display', 'block').fadeOut(5000);
  });
</script>