We Keep Coding

I need to replace the placeholder in this input field

I'm trying to replace this placeholder that says 'Search for...' to something else. The problem is - the input doesn't load for a while and I can't figure out how to detect when the input has loaded. Here's the page link so you can see how its loading https://asahouston.org/membership/member-directory/
Here's what I've tried, but it doesn't seem to be detecting the input field.
<script type="text/javascript">
document.addEventListener("load", function(){
document.getElementsByClassName(".SFfndtag input[type=text]").placeholder = "Search for Company Name...";
}
</script>
I've tried a couple other things, but my javascript skills are lacking. I would appreciate any help you're able to provide. Thanks!

Try changing
document.addEvenlistener('load'...
to
window.adEventListener('load'...
window.onload
By default, it is fired when the entire page loads, including its content (images, css, scripts, etc.) In some browsers it now takes over the role of document.onload and fires when the DOM is ready as well.
document.onload
It is called when the DOM is ready which can be prior to images and other external content is loaded.
--- EDIT ---
Definitly not the most elegant but this should do the trick.
var changePlaceholderInterval = setInterval(function () {changePlaceholder()}, 100);
function changePlaceholder() {
if(document.querySelector('.SFfndtag input')){
document.querySelector('.SFfndtag input').placeholder = "Search for Company Name...";
window.clearInterval(changePlaceholderInterval);
}
}

Use attr for JQuery or setAttribute for Javascript:
JQuery
$('.SFfndtag').attr("placeholder", "Search for Company Name...");
Javascript
document.getElementsByClassName("SFfndtag").setAttribute("placeholder","Search for Company Name...");
Hope it helped you.

Problems with original Jquery script, it won't start!

I'm suck a noob when it comes to java/jquery, I don't even know the basics. So please have understanding.
I've fetched this script from the jQuery website, but it won't start for me :/
What am I doing wrong?
The whole script is found on http://jsfiddle.net/xZUue/
Thank you for your help!

You have to call the miniscroller function on your div, like so:
$(function() {
$("#scroller").miniscroller();
});
see http://jsfiddle.net/qJkdy/

jQuery is loaded and so is the plugin, but your not making any use of it!
Do:
$('#scroller').miniscroller();

Check out..Its working...u were missing
<script>
$(function () {
$("#scroller").miniscroller();
});
</script>
updated link: http://jsfiddle.net/xZUue/5/

Ajax inserted content not accessible in DOM

I am working on a pure jquery/js site, mostly to practice some jquery. I am using a load statement to load a menu from a file of common html, like so:
$('#categoryListing').load('../common.html #categoryLinksUL');
which loads:
<ul id="categoryLinksUL">
<li>Anklets</li>
<li>Bracelets</li>
</ul>
The problem is where I am using it now I need to alter the href of the above links, but they are not part of the dom. In previous instances I was able to use .live(click... But not here. Is there a way I can accomplish this?
Specifically I need to load the links and change the href from #anklets to ?category=anklets

What about the following?
$('#categoryListing').load('../common.html #categoryLinksUL', function() {
$('li a[href^="#"']').each(function () {
this.href = '?category=' + this.href.substr(1);
});
});
In my example, after the load is completed, the anonymous function is called. It takes every anchor with a hash HREF and replaces it with an HREF based on your description.

Thank you Dimitry, you solution basically worked. I finally used:
$('#categoryListing').load('../common.html #categoryLinksUL', function() {
$('#categoryListing li a').each(function () {
var hashPos=this.href.indexOf("#");
var tCategory = this.href.substr(hashPos+1,this.href.length );
});
});
So why did jQuery recognize categoryListing there? I tried moving the each function outside of the load function and categoryListing did not contain any links. Is it because maybe the load was not completed when it tried to get categoryListing links? Seems like that is possible.
Thanks,
Todd

Stacking Images When Page Loads

I've read through a number of similar questions but nothing has worked for me yet. The url is here: http://www.promotion1.com/home-wmc-slide
I've installed a slider and the images are stacking before the script, I do not know JavaScript...
Would anyone be willing to look at the site and see if there might be a quick fix? I seriously need the help.
Thank you!

Try changing your javascript from $(window).load(...) to $(document).ready(..)
$(document).ready(function (){
$("#pikame").PikaChoose();
});

Make sure you're using the newest version of PikaChoose and then do the following.
For your css:
#pikame{ display:none; }
In your js:
$(document).ready(function (){
var showUL = function(){ $("#pikame").show(); };
$("#pikame").PikaChoose({buildFinished:showUL});
});

How can I tell when all images on a page are loaded using jQuery?

I’m using jQuery for my project. $(function(){...}) fires the function “when the DOM is ready” — this doesn’t say that all images are loaded, right?
Is there an event that gets fired when every image is loaded too?

I guess you mean
http://api.jquery.com/ready/
versus
http://api.jquery.com/load-event/
Example: Run a function when the page is fully loaded including graphics.
$(window).load(function () {
// run code
});
without jQuery:
window.onload=function() {
alert(document.images.length);
}

You can check on load event of image tag. This will get fired when image loading completes.
$("img").load(function(){
// your code
});

window.onload will solve this, I wrote about this there: http://amrelgarhy.com/blog/how-to-tell-when-images-have-loaded/