slash89mf slash89mf - 1 month ago 6
HTML Question

Select div using jquery not working

I have an event listener on dynamically created elements:

$(document).on('change', '.inputfile', function() {
var name = ($(this).val().split('\\').pop());

Once file is selected, i would like to append a paragraph showing the filename itself. My problem is that jquery selector is not working:

function selectFile(filename) {
var classes = $(this).closest('.inputgroup');

I would like to append the paragraph in the nearest div with class=inputgroup, because there are several div with that class.
Using a simple
is ok and paragraph is created.
This is the HTML:

<div class="inputgroup">
<label class="btn btn-default btn-info" style="margin-top: 8px">
Browse <input type="file" style="display: none;" class="inputfile"/>
<button type="button" class="btn btn-outline-danger" onclick="myAjax()">Ok</button>
<span id="remove_field" class="glyphicon glyphicon-remove" aria-hidden="true" style="vertical-align: middle"></span>


This line


Is searching for an element named "classes" - that's not a valid HTML element.

I think you wanted


Based on this line of your question

I would like to append the paragraph in the nearest div with class=inputgroup

But you should put this straight in the event handler, otherwise this has a different meaning

$(document).on('change', '.inputfile', function() {
    var name = ($(this).val().split('\\').pop());