Question

HTML

<div>my content of the div1
  <input/>
</div>​

<div>my content of the div2
  <input/>
</div>​

<div>my content of the div3
  <input/>
</div>​

JS

$('input').on('change',function(){
  var x = $('this').parent('div').val();
    alert(x);
})​​​;

My problem is why cannot I get the content of the div which the input was changed ?

Answer 1

Corrected Script

$('input').on('change',function(){
  var x = $(this).parent('div').html();
  alert(x);
})​​​;

• val() is for form fields only
• this should not be quoted.

Alternative

If you only want the text of the parent, you can use text(). However, browsers can differ on how they implement it (see the notes here). In this case, it’s probably cleaner to wrap the content you want in another element, like:

<div>
  <span>my content of the div1</span>
  <input/>
</div>​

And use script like:

$('input').on('change',function(){
  var x = $('this').siblings("span").html();
  alert(x);
})​​​;