jQuery does not trigger events using .trigger (except click)
<p>I have several Input-Fields whose values are displayed in my DOM tree. When I type something in the DOM-tree updates, but when I update the input-Field via <code>.val()</code> and then trigger the event with <code>.trigger("input")</code> nothing happens.</p>

<p>My input-field looks like this:<br/></p>

<pre><code>&lt;input value="This is a loaded text!" id="navInput4-0" data-iid="4-0" class="navInput form-control" type="text" /&gt;
</code></pre>

<p>The Event handler is bind through<br/></p>

<pre><code>$("#side-menu-div input[type!='file'], #side-menu-div textarea").unbind("input").on("input", function(){...});
</code></pre>

<p>And I try to trigger the event through<br/></p>

<pre><code>$("#navInput"+index+"-0").val(val).trigger("input");
</code></pre>

<p>The variable index is filled with a valid number -> .val(val) works fine!<br/>
I also tried to seperate the parts with no effect...<br/></p>

<pre><code>$("#navInput"+index+"-0").val(val);
$("#navInput"+index+"-0").trigger("input");
</code></pre>

<p>I also tried to trigger the event using<br/></p>

<pre><code>$("#side-menu-div input[type!='file'], #side-menu-div textarea").trigger("input");
$("*").trigger("input");
</code></pre>

<p>but nothing happened....</p>

<p>I also tried to bind the change-Event too, as this is what solved all the problems i found, and call it with <code>.change()</code> but this also won't work...<br/></p>

<pre><code>$("#side-menu-div input[type!='file'], #side-menu-div textarea").unbind("input change").on("input change", function(){...});
$("#navInput"+index+"-0").val(val).change();
</code></pre>

<p>Is this kind of a bug in jQuery 2.2.4 or am I missing an obvious part?</p>