Add automatic refresh to a div with JS

user_13009384 0
Viewed 53

The div works perfectly, but adding a new value to it results in NaN. But when updating the page, the div shows the updated value.

Would there be any way to add an automatic refresh to this div?

$(function () {

         $(".but").on("click",function(e) {

          e.preventDefault();
          $(".content").hide();
          $("#"+this.id+"div").show();

        });

    });
.content { display:none };
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<button class="but" type="button" id="Id">Load</button>


<div id="Iddiv" class="content">

  <h2>content div</h2>
  
</div>

var css html jquery javascript
2 Answers

$(function () {

         $(".but").on("click",function(e) {
         
        
         
         if ($("h2")[0].innerHTML=='content div'){
            $("h2")[0].innerHTML="";
         }else {
         
            $("h2")[0].innerHTML='content div';
         }
          
          
          
          
        });

    });
.content { display:block };
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<button class="but" type="button" id="Id">Load</button>


<div id="Iddiv" class="content">

  <h2></h2>
  
</div>

user_43989660

Given that hadent supplied where the new data comes from. Here are 2 examples.

Example one:

<button class="btn1" type="button" id="Id" data-newtxt="Example Text">Load</button>

<div id="section1">
    <h2>content div</h2>
    <span class="new-data"></span>
</div>

<script src="https://code.jquery.com/jquery-3.5.1.min.js"></script>
<script>
jQuery(document).ready(function($) {
    $('.btn1').click(function() {
        $('.section1 .new-data').text( $(this).data('newtxt') );
    })
});
</script>

Example two:

<button class="btn2" type="button" id="Id" data-newtxt="Example Text">Load</button>
<div class="hidden-div">Some example content</div>

<div id="section2">
    <h2>content div</h2>
    <span class="new-data"></span>
</div>


<script src="https://code.jquery.com/jquery-3.5.1.min.js"></script>
<script>
jQuery(document).ready(function($) {
    $('.btn2').click(function() {
        $('.section2 .new-data').text( $('.hidden-div').text() );
    })
});
</script>
user_9156360
Related