Question

My page has dynamic divs and within them I want to toggle between two divs. I need to preserve the original value of the div so this may be the wrong approach

Here’s my code thus far, I cannot seem to get it going.

$(".change").live("click", function() {
  var changeDiv = $(this).parents(".changeContainer").find(".changeDiv");
  changeDiv.toggle();
  changeDiv.html(changeDiv.html() == '<input type='text' />' ? 'Original Value of the DIV' : '<input type='text' />');
}


<div class="changeContainer">
   <div class="changeDiv">Basketball - <a href="#" class="change">Change Sport</a>   </div>
</div>

Answer 1

Rather than a toggle, just use standard show/hide. Put in both divs, have one of them start with style="display:hidden" and then use jquery .hide() and .show() on the appropriate divs to swap between them.