Jquery: Change input submit value after the element has loaded

Question

I am trying to change the value of this input from "Search" to "Filter":

<input type="submit" value="Search" name="refinementSearchButton" class="IDX-refineSubmit" id="IDX-resultsRefineSubmit">

I have no control over the input itself, which is inserted via javascript. I do have control of the wrapper, so I can add javascript to the page.

I need to wait until everything has rendered, or at least the input itself, and then change the input value.

I thought this would work to look for the ID of the input and then change it once it is detected:

$(window).load(function ()
{
    var i = setInterval(function ()
    {
        if ($('#IDX-resultsRefineSubmit').length)
        {
            clearInterval(i);

            // execute code here

    $("#IDX-resultsRefineSubmit").prop('value', 'Filter');

        }
    }, 100);
}); 

However this does not work.

Any help appreciated.

Answer 1

It was a javascript conflict with the version that was loading the page contents. It turns out that the $ variable was already in use, here's what worked:

 var jQuery = jQuery.noConflict();

    jQuery(function(){

    jQuery("#IDX-resultsRefineSubmit").val('Filter');  

    });