Selecting elements of a page using jQuery

Selecting elements of a page using jQuery

I'm a total jQuery noob. A colleague showed me how to select a form field
on a website using jQuery and I was blown away what it can do. So, instead
of reading the documentation from start to finish, I decided to fiddle
with it and see how far I come. I wanted to see how scripting a website
would work. I chose Trello as test subject.
I'm inside a Board, and now I want to click "Add a card" on a particular
List. I can't figure out the exact jQuery command. This is how a card
looks like. At the beginning you can see how the general list of cards
begins:
<div class="list-area js-list-sortable js-no-higher-edits clearfix
ui-sortable" style="width: 2606px;">
<div class="list" style="width: 220px;">
<div class="list-header clearfix ed">
<div class="list-title non-empty clearfix editable" attr="name">
<h2 class="hide-on-edit current">
Monday
</h2>
<p class="num-cards"></p>
<div class="edit edit-heavy clearfix">
<textarea type="text" class="field
single-line"></textarea>
</div><a href="#" class="icon-sm icon-menu dark-hover
js-open-list-menu"></a>
</div>
</div>
<div class="list-card-area">
<div class="list-gradient-top"></div>
<div class="list-gradient-bottom"></div>
<div class="list-cards fancy-scrollbar clearfix js-sortable
ui-sortable" style="max-height: 378px;"></div>
</div><a class="open-card-composer js-open-card-composer"
href="#">Add a card…</a>
</div>
What I have is this:
$('.js-open-card-composer').parent('.list').find('.list-header').first('.list-title').first(".hide-on-edit:contains('Monday')");
This returns the exact card I'm looking for (actually just the title div
of it), but when I add .click() it doesn't work. Is my approach right
though?
I'm sorry if this questions has been asked already. In this case, it would
be nice to get a link to that question. I couldn't find it.
Thanks for help and suggestions.