We Keep Coding

Jquery on Wordpress Frontend not woorking

Maybe I am so noob with jQuery but cant reach my objective. I need to add the attribute target="_blank to all the links inside certain divs. But anything I do works.
I have checked for jquery loaded with:
if(wp_script_is('jquery')==false) {
wp_enqueue_script("jquery");
}
Using the the following code nothing happens:
jQuery("#adagal").html("<p>asdf*</p>");
The #adagal element remains with previous content. I have checked in the source if my javascript file was correctly added, and it is.
<script type='text/javascript' src='http://localhost/wordpress/wp-content/plugins/AdManagerAdagal/js/ads/show_ad.js?ver=4.3.1'></script>
So, what is the problem¿?

Use that:
jQuery(document).ready(function($)
{
$(".your_class a").attr("target", "_blank");
});
Don't forget $ in ready(function to use jquery in your js

Javascript works in HTML but not javascript file

my javascript code works withing a my html file but when I move it to a javascript file of its own, it doesn't work. I checked and it is not an issue with the file location. And it doesn't work in any browser. Please help. Thank you.
My HTML calling the file:
<script type="text/javascript" src="js/click-dropdown.js"></script>
Here is my javascript code:
$(document).ready(function() {
$('.prospectus-click').click(function() {
//REMOVE THE ON CLASS FROM ALL BUTTONS
//$('.prospectus-form > div').parent().removeClass('on');
$('.prospectus-arrow').removeClass('prospectus-arrow-up');
//NO MATTER WHAT WE CLOSE ALL OPEN SLIDES
$('.table-wrap').slideUp('fast');
//IF THE NEXT SLIDE WASN'T OPEN THEN OPEN IT
if($('.prospectus-click').next().is(':hidden') == true) {
//ADD THE IMGON CLASS TO THE IMAGE
//$(this).find('.accimge').addClass('imgon');
//ADD THE ON CLASS TO THE BUTTON
$('.prospectus-arrow').addClass('prospectus-arrow-up');
//OPEN THE SLIDE
$('.prospectus-click').next().slideDown('medium');
}
});
/*** REMOVE IF MOUSEOVER IS NOT REQUIRED ***/
$('.prospectus-click').mouseover(function() {
$(this).parent().addClass('over');
}).mouseout(function() {
$(this).parent().removeClass('over');
});
$('.table-wrap').hide();
$('.live-consult').click(function() {
//NO MATTER WHAT WE CLOSE ALL OPEN SLIDES
$('.live-consult-div').slideUp('fast');
//IF THE NEXT SLIDE WASN'T OPEN THEN OPEN IT
if($('.live-consult').next().is(':hidden') == true) {
$('.live-consult').next().slideDown('medium');
}
});
/*** REMOVE IF MOUSEOVER IS NOT REQUIRED ***/
$('.live-consult').mouseover(function() {
$(this).parent().addClass('over');
}).mouseout(function() {
$(this).parent().removeClass('over');
});
$('.live-consult-div').hide();
});

The Javascript file you have written is using the jQuery library. In order for this to work you must load the jQuery library prior to your script.
You can download jQuery from here http://jquery.com/
I would also suggest for performance that you use the minified file and make your scripts load at the bottom of your html page before the closing body tag.
<script type="text/javascript" src="js/jquery-min-1.11.0.js"></script>
<script type="text/javascript" src="js/click-dropdown.js"></script>

As Nevett and David mentioned suspected that you might be including/loading your 'click-dropdown.js' file prior to inclusion of jquery library. But if you are not sure in which order you have the included your script, then simple way to detect is either check you dev console for error "ReferenceError: $ is not defined" or just simply write
alert('my $ is '+typeof $);
as the very first line of your script. If alert says undefined then include your script after jquery. If alert says function then please describe what is the exact problem you are facing; any error, warnings.

$(document.body).css not working

I have been trying to change the background image of my HTML body with a .js but nothing happens. Do I need to put the Javascript code inside my HTML?
function plano1() {
alert('you');
$(document.body).css('background-image', 'url(img/planoSelected.png)');
}
This is the complete function I have been trying to do. Google Chrome shows the alert, but doesn't do the $(document.body). What am I supposed to do?
Notes: I use the function with a "onmouseover". I have already tried to use:
$('body').css('background-image', 'url(img/planoSelected_2.png)');
$("body").css('background-image', 'url(img/planoSelected_2.png)');

The jQuery code should be called at the bottom of the page, above the closing body tag.
Load jQuery first:
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function() {
$('body').css('background-image', 'url(img/planoSelected_2.png)');
});
</script>

The code is fine, but there are a few reasons why this might not work.
Make sure the image paths are correct, relative to the script's location
Is plano1 called?
Make sure jQuery is actually loaded
Make sure the DOM is ready when calling the function (use $(document).ready if not sure)
Make sure there are no errors in the code before plano1 is called
If these things are all right, and it still doesn't work, check if your onmouseover is working at all. Simply alert or log something in the console.

jQuery not loading at all

I'm trying out jQuery for the first time, and I'm not sure how to make it work properly. I've included the following code near my opening <head> tag:
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8/jquery.min.js" type="text/javascript"></script>
Followed by the following jQuery code:
<script>
$('.darkmask > img').hover(function(){
$(this).parent().toggleClass('darkmask-hover');
})​
</script>
Unfortunately, this code doesn't work when I try it in a browser, or in JSFiddle. However, when I set JSFiddle's framework to load jQuery itself, rather than loading jQuery through my own code, the animation works properly.
Am I loading jQuery wrong? If so, what's the right way?

PRoblem is, your code in JSFiddle is executed on the loading on the page. In your code instead, the execution happens when the HTML elements are not yet loaded because it's in the HEAD, so the selectors like .darkmask actually refer to... nothing.
The solution is to use:
$(document).ready(
function()
{
... your code here
}
To ensure that it is executed when the page is loaded and ready, all the HTML elements are there and therefore JQuery selectors can operate on something.

Are there any HTML elements when the code is executed?
Try:
$(function () { // this function executes when the page loads
alert(x);
// put your code here
});

Wrap your entire code in the following:
$(document).ready(function() {
//ALL CODE GOES HERE
});

Wrap your code in:
$(function() {
.... Your code here ...
});
It will mean your code is executed after the DOM tree is loaded.

You do need to wrap your jQuery code within the ready function, like this:
$(document).ready(function(){
// put your code here.
});
Also make sure your script tags have type="text/javascript" as an attribute otherwise it won't get run as javascript.

Works perfectly in jsfiddle, but not in live website. Why?

Website test page: http://www.lantiis.com/indexold.html
jsFiddle: http://jsfiddle.net/Guhb4/7/
I received help with the jQuery and it works perfect in jsFiddle. (temp sign-in as Lantiis here: Can independently show/hide. How do I hide on show?)
When I transfered the code, everything worked except the images. The background images show up, the link images show up, but not the main images that have the site content which is what I needed the jquery for. I have no idea what I did wrong when I transferred the code over.
I am sure this is just a stupid mistake on my part, but as I am still learning js, I am at a total loss at this point. I thought I had it pretty good until I posted my first question and saw how messy my code was in comparison to the users code who helped me.
Any and all direction and criticism is welcome.

You need to include the jQuery library in your HTML.
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js"></script>
http://docs.jquery.com/Downloading_jQuery
And wrap your jQuery code in the following:
<script type="text/javascript">
$(document).ready(function() {
//Your code here
});
</script>
http://docs.jquery.com/How_jQuery_Works#Launching_Code_on_Document_Ready

In addition to including the jQuery library (as mentioned by Callum) and placing your code within an onload function (as mentioned by CleverQuack), your script also needs to have a type of text/javascript, not just javascript. Something like this should work:
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$('#mask > div:first-child').show();
$('#top a').click(function() {
var keyterm = $(this).attr('title');
$('#mask > div').hide();
$('div[id=' + keyterm + ']').slideDown('slow');
});
});
</script>