Ruby on Rails (3.2+) - Updating a tag after a textarea's OnChange Event

Question

I'm a beginner in Ruby on Rails and am currently going through the tutorial at railstutorial.org. I'm currently trying to use jQuery in conjunction with Ruby on Rails but seem to be having trouble.

On my website, users can create posts similar to how they are made on Twitter, and each post has a 140 character limit. I have created a paragraph tag for displaying how many characters left the user can type in, but I cannot seem to figure out how to set and update the paragraph tag's value. I figured that I would need to handle the OnChange event for the textarea. In the event handler, I would obtain the textarea text's length, subtract it from 140, and then assign that value to the p tag's innerHTML to ultimately display how many characters the user can type in.

You can see the Ruby on Rails code for my page below:

<%= form_for(@micropost) do |f| %>
<%= render 'shared/error_messages', object: f.object %>

<div class="field">
    <%= f.text_area :content, placeholder: "Compose new micropost..." %>
</div>

<p id="charsremaining" style="text-align: right"></p>

<%= f.submit "Post", class: "btn btn-large btn-primary" %>

The lines of interest are the "f.text_area" and the "p id="charsremaining"" lines. Here's my JavaScript code for updating the p tag's value after the user types into the f.text_area field:

$('#micropost_content').change(function() {
textbox = $(this);
charsleft = (140 - textbox.val().length);

paragraph = $('charsremaining');
paragraph.innerHTML = charsleft + " characters remaining."; });

I believe that I am monitoring the OnChange event for the textarea with the above code. By doing so, whenever the user types in the textarea field, the change is detected, and the p tag is automatically updated with the correct number of characters remaining. The problem is that my JavaScript code is not working at all. I have saved the above JavaScript code to the following file: /app/assets/javascripts/micropost.js

I think that the file will be handled by the Asset Pipeline, but I'm not sure whether or not the Pipeline really is recognizing it. Additionally, I'm not sure if my JavaScript code is correct for my specific situation.

Any help would be greatly appreciated. I apologize for the long post.

---

EDIT [RESOLVED]:

It turns out I found the answer elsewhere on SO: Micropost character countdown (Rails Tutorial, 2nd Ed, Chapter 10, Exercise 7). See the first answer.

But for those who are curious as to what was wrong, I was not listening to the document.ready event in jQuery. I guess I assumed that Ruby on Rails already included it. Here is my final JavaScript code (still saved as /app/assets/javascripts/micropost.js):

function UpdateCharsRemaining()
{
    var textbox = $('#micropost_content');
    var charsleft = (140 - textbox.val().length);

    var paragraph = $('#charsremaining');

    var text = charsleft + (charsleft != 1 ? " characters" : " character") + " remaining";

    paragraph.text(text);
}

$(document).ready(function($)
{
    UpdateCharsRemaining();

    $('#micropost_content').change(UpdateCharsRemaining);
    $('#micropost_content').keydown(UpdateCharsRemaining);
    $('#micropost_content').keyup(UpdateCharsRemaining);
});