Why does this code hide the div that's used as the jQuery selector on blur() if I click inside it? Blur() should only hide it if I click outside it.HTML trigger:\[code\]<div class="header">To-Do <a class="triggernewtodo">Add a task...</a></div>\[/code\]li to show/hide:\[code\]<li class="addnewtodo"> <%= form_for(@project_todo) do |f| %> <%= f.hidden_field 
roject_id, :value =http://stackoverflow.com/questions/13731177/> @project.id %> <%= f.hidden_field :status, :value =>"f" %> <%= f.text_area :title, :class => "addtodotextarea" %> <div class="controlarea"> <%= f.submit :class => "primary", :value =http://stackoverflow.com/questions/13731177/>"Add" %> </div> <% end %> </li>\[/code\]jQuery:\[code\]// Show/Hide New Todo form$('a.triggernewtodo').click(function() { $('li.addnewtodo').show() $('textarea.addtodotextarea').focus();});$('li.addnewtodo').live("blur", function() { $(this).hide();})\[/code\]My guess is that it has something to do with the .focus() placed on the textarea, because if I take out that .focus(), it works properly until I click inside the textarea then click out (still inside the list item) and it hides the whole list item. Any ideas? What am I doing wrong?
roject_id, :value =http://stackoverflow.com/questions/13731177/> @project.id %> <%= f.hidden_field :status, :value =>"f" %> <%= f.text_area :title, :class => "addtodotextarea" %> <div class="controlarea"> <%= f.submit :class => "primary", :value =http://stackoverflow.com/questions/13731177/>"Add" %> </div> <% end %> </li>\[/code\]jQuery:\[code\]// Show/Hide New Todo form$('a.triggernewtodo').click(function() { $('li.addnewtodo').show() $('textarea.addtodotextarea').focus();});$('li.addnewtodo').live("blur", function() { $(this).hide();})\[/code\]My guess is that it has something to do with the .focus() placed on the textarea, because if I take out that .focus(), it works properly until I click inside the textarea then click out (still inside the list item) and it hides the whole list item. Any ideas? What am I doing wrong?