javascript - Show a tasks list by clicking on project name -

i have 2 models project , task. each project has many tasks.

there list of projects on project index page.

and want, when user clicks on project name, list of project's tasks shown aside projects list

i try that.

application.js

$(document).ready(function(){   $('#projects').on('click', 'h2', function(){     $('#tasks').append("<%= escape_javascript render(:file => 'tasks/index.html.erb') %>");   }); }); 

is correct change application.js file extansion js.erb?

update

result of work _project.html.erb

<%= link_to " #{project.title} tasks list", project_tasks_path(project), :remote => true %> 

task_controller.rb

  def index @project = project.find(params[:project_id])     @tasks = @project.tasks respond_with @tasks 

end

index.js.erb

$('#project-tasks').html("<%= j render :file => 'projects/tasks/_tasks', :locals => { :tasks => @tasks }  %>"); 

_tasks.html.erb

<%= render @tasks %> 

you should use rails way this. use ajax call , make js.erb file update view. see http://railscasts.com/episodes/205-unobtrusive-javascript.