Focus textarea on mobile from click event using jQuery .trigger()
<p>Alrighty, I'm stuck. </p>

<p>I'm trying desperately to focus on a text area programmatically from javascript (jQuery) on mobile. I did my research, and learned that the only way to bring the keyboard up with .focus() is to use a click event. So I made a click event. And it works when I click on the element, except I need to trigger this from a touchhold on a different element. So naturally, I tried .trigger() and .triggerHandler() on the element. But neither of those things work. </p>

<p>TLDR; I need to be able to hold on an element from a list, and after a time, a div will slide down with a textarea and the textarea gets focus (with keyboard).</p>

<p>Any help is appreciated!</p>

<p>Here is my code: </p>

<pre><code>&lt;div class="quicknote" data-id="0"&gt;
    &lt;span&gt;New Note&lt;/span&gt;
    &lt;div class="name"&gt;&lt;/div&gt;
    &lt;textarea class="text"&gt;&lt;/textarea&gt;
    &lt;div class="toolbar"&gt;
        &lt;div class="left cancel"&gt;cancel&lt;/div&gt;
        &lt;div class="right finish"&gt;finish&lt;/div&gt;
    &lt;/div&gt;
&lt;/div&gt;
</code></pre>

<p>jQuery</p>

<pre><code>jQuery(document).ready(function($) {
    var holdThresh = 800;
    $(".row").on("touchstart", function(e) {
    var id = $(this).attr("data-id");
    var name = $(this).html();
    $(this).addClass("down");
    var timer = setTimeout(function() {
        $(".quicknote").attr("data-id", id);
        $(".quicknote .name").html(name);
        $(".quicknote").addClass("open");
        $(".quicknote").trigger("click");
        e.preventDefault();
    }, holdThresh);

    $(this).one("touchend touchmove", function(event) {
        $(this).removeClass("down");
        clearTimeout(timer);
    })

    $(".quicknote .cancel").on("touchstart", function() {
        $(".quicknote").removeClass("open");
    })

    $(".quicknote").click(function(event) {
        $("textarea").focus();
        event.preventDefault();
        event.stopPropogation();
    })
});
</code></pre>