We Keep Coding

Using JQuery on SharePoint. Scripts work in a Fiddle on both browsers, but doesn't work on page in IE

Using SharePoint 2010 on-prem. Loading up some JS in a content editor webpart to show some data when a button is clicked. After my first attempt I had it working in Chrome but nothing would happen in IE. It's a simple removeClass function and it is working on my fiddle in both browsers: https://jsfiddle.net/1kqhmL2j/1/
I have had issues using show/hide in the past which is why I'm using a Display: none class. Everything is !important because SharePoint.
Not really sure where to start on the trouble shoot, as most searches of these terms don't seem to get me anything SharePoint specific. Have tried using the JQuery library directly on page as opposed to linked from Google's CDN, played with where it loads on the page, etc. Any help would be hugely appreciated.
The scripts:
$(document).ready(function(){
$(".but1").click(function(){
$(".blurb1").removeClass("hidden");
});
});
$(document).ready(function(){
$(".but2").click(function(){
$(".blurb2").removeClass("hidden");
});
});
$(document).ready(function(){
$(".but3").click(function(){
$(".blurb3").removeClass("hidden");
});
});
$(document).ready(function(){
$(".but4").click(function(){
$(".blurb4").removeClass("hidden");
});
});
$(document).ready(function(){
$(".but5").click(function(){
$(".blurb5").removeClass("hidden");
});
});

Using an earlier version of JQuery solved it - sorry folks

In your environment, is basic JavaScript working? i.e. is it a problem that JavaScript itself is not working, as opposed to just an issue with your script syntax?

angularjs adding float labels

I am trying to add floatlabels to my project, and I have added the floatlabel.js and jQuery files and references to the project, but when I try to initialize it with:
<script>
$('input.floatlabel').floatlabel();
</script>
It gives the error: 'the object doesn't support the method floatlabel'. I have also tried this:
<script>
$(function(){ // document.ready
$('input.floatlabel').floatlabel();
});
</script>
What am I missing?
As someone pointed out, it's not an angular question, well that proves how confused I am, since I thought it was for angular, turns out, it's not. but this float-label is, and it works perfectly, sorry for my blunder.

You have to make sure that you are using correct version of the jquery for the floatlabels js . And you also have to load it after the loaded jquery .
And after that you can initialize the script .

Object has no method error after no conflict

I am working on a site where I am using Scott Robbins pageslide to show/hide a responsive navigation.
For some reason the pageslide navigation works fine on the rest of the site but, when it gets to the contact page, it breaks: http://kevinpresbrey.com/contact
I took a look at the console in Chrome and I'm getting this error:
Object [object Object] has no method
I updated the jQuery call for pageside from this:
$(".open").pageslide({ direction: "right"});
To this:
jQuery(".open").pageslide({ direction: "right"});
and it's still blowing the error and causing the pageslide not to function on the contact page.
Like I mentioned before, it works fine on all the other pages, but the contact page. I have a feeling that the embedded form that was generated from constant contact might be causing the issue, but other than that, I have no idea.
Any suggestions?

You have multiple versions of jQuery in your code, which could be causing the problem (even though some of the other code seem to be working). You have v1.8.3 and v1.8.2.
One of them is being pulled from:
http://www.formstack.com/forms/js/3/jquery.min.js
the other one from:
http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js?ver=3.6
Fix that and your code should work.

Ok, I figured out what it was.
Looks like it was partially from what Hanlet said. There were two version of jQuery that were being pulled.
Apparently when I commented out the code that pulls in jQuery within my functions.php file it defaulted to the version that comes baked in with Wordpress which is version 1.10.2 and that apparently fixed the issue.
So, yeah. Hooray...I guess?

"pageslide" is not a build-in method for jquery selectors. You may want to double check if you include the "pageslide" javascript library / jquery plugin correctly.

`The function $(Window) is undefined` err in jquery

I used the Jquery 1.9.1 and used the code to fire when browser window will get closed as
My JSP will be ,
But this shows a red underline error like show in picture in eclipse.
I don't know why I am getting this error.Can any one help me to solve this.
Don't hesitate to ask any question.
Good answers are definitely appreciated.

Have you tried wrapping the code in doc ready handler:
$(function(){
//here unload and before unload
});
and you have to look that your jquery 1.9.1 is properly loading.
about error:
That is quite possible if you are using a CDN Hosted jQuery library. Try loading it locally and referencing it from there.

$ is an alias for jQuery. If $ is undefined it means the jQuery library has not been properly loaded. Be sure to include it in the page before attempting to use any jQuery methods.

replacing page content with .html(content) is not working

I have a weird problem in jQuery. The problem is that I can smoothly use $('#container').html(content) to replace the page content but to specific page. It is not working all around. Gives 'TypeError' message in console. Is there any probability that using SlickGrid can cause such error. Because error is thrown only in that pages where I have used SlickGrid.
Any suggestion would be highly appreciated.

It's hard to tell what's going on with your page, but my guess is that you may have a conflict with the $ between jQuery and SlickGrid. Look at the noConflict function in jQuery - it may help you out.
Call $.noConflict(); before SlickGrid's javascript <script> tag is added, and then refer to jQuery functions by using jQuery(selector) instead of $(selector).
Hope this helps!