Insert jQuery with script to change elements

Question

I am inserting HTML into my webpage and want to change some of the elements with jQuery. The file is being read every second and this is the element that I want to change:

<div id="progress" class="progress-bar progress-bar-info progress-bar-striped" role="progressbar" aria-valuenow="20" aria-valuemin="0" aria-valuemax="100" style="width: 20%">

I tried the following (didn't work):

<script>
function change(){ $("#progress").attr('aria-valuenow', '60'); 
};
change();
</script>

I also tried this (didn't work):

<script>
function change(){ $("#progress").attr('aria-valuenow', '60'); }; change();
</script>

The website is definitely reading properly from the file, and it is probably just the way that I am inserting the code that doesn't make the change.

Help please.

P.S. I am re-reading the file that inputs the HTML with the following AJAX call. Basically it just re-reads the file every second and appends html to a div:

<script>
$(document).ready(function() {
    var filename = "path/to/file/" + fileName;
    console.log(filename);
    setTimeout(functionToLoadFile, 10);
    function functionToLoadFile(){
            $.ajax({
                url: filename,
                cache: false,
                success: function(data) {
                    $('#content').html(data);
                    setTimeout(functionToLoadFile, 1000);
                },
            });
    }
});
</script>

Thanks to everyone who responds <3

Did you try inserting your JS code in $(document).ready(function() { change(); }); ? Basically it assures you that your code "waits" for the DOM to be loaded before trying to access / modify it : learn.jquery.com/using-jquery-core/document-ready. The change function can be outside. — Florian Motteau
– Florian Motteau, Commented Jun 27, 2015 at 15:30
Flo, the page is already loaded and I am making an AJAX call for a file that appends html to it. Fuyushimoya and vinayakj, I edited my first message with the AJAX call. Thank you all for the cooperation. — Neekoy
– Neekoy, Commented Jun 27, 2015 at 15:49

tom · Accepted Answer · 2015-06-27 15:35:01Z

1

Try this jsfiddle

Basically:

$("#progress").progressbar("option", "value", 60);

answered Jun 27, 2015 at 15:35

tom

1,5031 gold badge18 silver badges31 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

Neekoy Over a year ago

Thank you for the suggestion, however I am getting an error 'Uncaught TypeError: $(...).progressbar is not a function' even though it's working on the jsfiddle that you sent :(

mplungjan Over a year ago

He included jQuery UI

Neekoy Over a year ago

Oops, you are absolutely correct. I tried it this way and still no joy, however since it is working for him it should definitely work on my end too. Thank you all very much for the suggestions.

Collectives™ on Stack Overflow

Insert jQuery with script to change elements

1 Answer 1

3 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

3 Comments

Your Answer

Sign up or log in

Post as a guest

Related