jQuery- Detect change in the content of a SPAN field

Question

I have the below piece of code which is used to simulate a text box:

ALERT VALUE:


        

Answer 1

i think this code will help you.

$(document).ready( function() {
    $('#myId').bind( "contentchange", function(){
        alert("Changed");
    });

    $( "#btn" ).click( function () {
        $('#myId').html( "Value" ).trigger( "contentchange" );
    });
});

http://jsfiddle.net/RKLmA/192/

Answer 2

You can use this event DOMSubtreeModified:

$("span").on('DOMSubtreeModified', function () {
  alert("Span HTML is now " + $(this).html());
});

Snippet

$(function () {
  $("a").click(function () {
    $("span").html("Hello, World!");
  });
  $("body").on('DOMSubtreeModified', "span", function () {
    alert("Span HTML is now " + $(this).html());
  });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<span>Hello</span>
<a href="#">Click</a>