We Keep Coding

.is(":checked") doesn't work in jQuery

I'm new to jQuery and I need to check if the checkbox is checked. In other posts I saw that I need to use .is(":checked") to solve it, but somehow it doesn't work.
$('.neutral').on('click', function() {
var checkbox = $(this);
if (checkbox.is(":checked")) {
console.log('checked');
} else {
console.log('unchecked');
}
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="checkbox" class="neutral" />
In this code I have 2 problems and I don't know how to solve it.
When I'm using console.log('checked') outside of the if statement (after checkbox variable) and I click on the checkbox one time, console prints the result 2 times.
I don't know why this if statement doesn't working.
Thank you for your time and help.

checked happens after the change event,just replace click with change.
$('.neutral').on('change', function() {
var checkbox = $(this);
if (checkbox.is(":checked")) {
console.log('checked');
} else {
console.log('unchecked');
}
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="checkbox" class="neutral" />

I have seen your code, I think you should try
$(document).on("click",".neutral",function() {
// Write code here
});
Instead of your code, Replace this code to as i written
$('.neutral').on('click', function() {
// Code here
});
For more undesirability see here
$(document).ready(function() {
// This WILL work because we are listening on the 'document',
// for a click on an element with an ID of #test-element
$(document).on("click","#test-element",function() {
alert("click bound to document listening for #test-element");
});
// This will NOT work because there is no '#test-element' ... yet
$("#test-element").on("click",function() {
alert("click bound directly to #test-element");
});
// Create the dynamic element '#test-element'
$('body').append('<div id="test-element">Click mee</div>');
});
Visit these link that may help you more for your implementation
Statck over flow link
jsFiddle Link

Showing value in form fields if class exists

When the form fields are inputted and submitted (#submit_btn) correctly my values disappear. When they are not valid this doesn't happen. I have tried fixing this with jQuery:
$('#submit_btn').click(function() {
if($("#register .wpcf7-mail-sent-ok") === true) {
$('#name-007').val('Full Name').show();
$('#email-007').val('Email').show();
$('#phone-007').val('Phone Number').show();
}
});
but it is not working.
Edit: #register is parent and .wpcf7-mail-sent-ok is child
Any ideas?

From what I understood this should work for you:
$('#submit_btn').click(function() {
if($("#register .wpcf7-mail-sent-ok")) {
$('#name-007').val('Full Name').show();
$('#email-007').val('Email').show();
$('#phone-007').val('Phone Number').show();
}
});
checking $("#register .wpcf7-mail-sent-ok") with true will not work as it is a dom object which is truth-sy but not strictly same as true

Try this:
$('#submit_btn').click(function() {
if($("#register .wpcf7-mail-sent-ok").length) {
$('#name-007').val('Full Name').show();
$('#email-007').val('Email').show();
$('#phone-007').val('Phone Number').show();
}
});
This is the "proper" way of checking if element exists.
No need for using " > 0" or "==="

$('#submit_btn').click(function() {
if($("#register").hasClass("wpcf7-mail-sent-ok") {
$('#name-007').show();
$('#email-007').show();
$('#phone-007').show();
}
});

Generalize a specialized JQuery function

This is a question about Multiple Checkbox Select/Deselect Using JQuery:
http://viralpatel.net/blogs/multiple-checkbox-select-deselect-jquery-tutorial-example/
which has the functionality of selecting multiple items from a list to process them. The Online Demo is at:
http://viralpatel.net/blogs/demo/jquery/multiple-checkbox-select-deselect/jquery-select-multiple-checkbox.html
I've extended the demo to include several groups, and have made the sample JQuery JavaScript function to work for one case, the BlackBerry one. The working code is at http://jsfiddle.net/jLx5z99q/3/.
In it, this is the specialized function that I want to generalize:
$(function () {
$("#BlackBerry").click(function () {
$('.case_blackberry').attr('checked', this.checked);
});
$(".case_blackberry").click(function () {
if ($(".case_blackberry").length == $(".case_blackberry:checked").length) {
$("#BlackBerry").attr("checked", "checked");
} else {
$("#BlackBerry").removeAttr("checked");
}
});
});
I want to generalize it so that the "#BlackBerry" and ".case_blackberry" are two parameters to the function, so that I can call it several times to cover other groups as well.
I'm not a JavaScript developer. Please help.
UPDATE:
I've posted the full working html source code at http://pastie.org/10278464.
Also, FYI, this full working html source code is generated automatically by easygen with this template. This html test code is the reason that I wrote easygen, to make it easy to write whatever test case whatever the way I like. Hope it will help someone else too.
Thanks

You need define some specific attributes.
Try this fiddle.
Example Fiddle:: http://jsfiddle.net/iboylmz/2acnLzzw/3/

This could work:
function bindMulti( parent, children ) {
parent.click(function () {
children.attr('checked', this.checked);
});
children.click(function () {
if (children.length == children.filter(':checked').length) {
parent.attr("checked", "checked");
} else {
parent.removeAttr("checked");
}
});
};
Use like this:
bindMulti($('#select_all'),$('.children'));
bindMulti($('#BlackBerry'),$('.case_blackberry'));

Maintaining your current's code logic and flow and element identification, you can do:
$(function () {
$(".case_subgroup_all").click(function () {
$('.case_'+$(this).attr('id').toLowerCase()).attr('checked', this.checked);
});
$(".case_blackberry").click(function () {
if ($(".case_blackberry").length == $(".case_blackberry:checked").length) {
$("#BlackBerry").attr("checked", "checked");
} else {
$("#BlackBerry").removeAttr("checked");
}
});
});
I've also added case_subgroup_all to your 'check all' checkboxes, in order to call your event handler.
jsfiddle: http://jsfiddle.net/jLx5z99q/5/

Correct jQuery to read from a select option

My script doesn't seem to be working correctly, what I'm trying to get is pretty self explanatory. I have tried several diffrent ways to make this work, searched around and tried to solve it.
I also tried to check the chrome log via console.log() but it didn't run the code through.
So if you know the solution to make it work I would appreciate the answer on how you solved it and what was wrong in the code.
NEW: The fiddle below includes the HTML.
jQuery(document).ready(function($){
$('#cart_review .quantity option :selected').change(function (event) {
$quan = $(this);
console.log($quan.parent().next()[0]);
$quan.parent().next().find('.price').text(function () {
return $quan.val() * parseInt($(this).attr('data-val'), 10) + ' kr';
});
var total = 0;
$('#cart_review .price').each(function(k, v){
total += parseFloat($(v).text(), 10);
});
$('#total').text(total + ' kr')
});
});
Check out this jfFiddle

Option does not have change event, select does. You need to Change the handler to:
$('#cart_review .quantity').change(function (event) {
//rest code
});
jfFiddle

use this
$('#cart_review .quantity').change(function (event) {
// your logic here
}
instead of
$('#cart_review .quantity option').change(function (event) {}
working fiddle
Hope this helps...

http://jsfiddle.net/uQ2F8/3/
$(function(){
$('select.quantity').change(function (event) {
Hey I just changed your selector, I think this is what you're trying to accomplish. I did it with the first one.

If statement not triggering alert box

I am trying to create a if statement that triggers a alert box if there is text in the div.
My Jsfiddle: http://jsfiddle.net/D7cPT/21/
My HTML:
<div id="post-preview">aasasdasd</div>
MY JQUERY:
$(document).ready(function() {
// Bind it to some action.
if{$('#post_body_html').html();) {
alert('asdasda');
}
});

OH DEAR GOD:
//why is there a bracket after the if and a semicolon in there?
if{$('#post_body_html').html();) {
How about:
//change if{ to if( and remove semicolon
if($('#post_body_html').html()) {
Also your selector doesn't match the ID of your element. Change #post_body_html to #post-preview
jsFiddle
Edit:
To those who land here later on, a better way to accomplish the same test is written:
if($('#post_body_html')[0].childNodes.length) {
instead.

Try this ->
$(document).ready(function() {
// Bind it to some action.
if($('#post-preview').html()) { // wrong ID and wrong syntax
alert('asdasda');
}
});
Working demo : http://jsfiddle.net/manseuk/D7cPT/25/

You have MANY problems:
It should be post-preview, not #post_body_html
You have if { instead of if (
You end your if statement with a semi-colon? Huh?
html() doesn't return a bool, it returns a string.
Try this:
$(document).ready(function() {
// Bind it to some action.
if ($('#post-preview').html().length > 0) {
alert('asdasda');
}
});

You should remove the ;
$(document).ready(function() {
// Bind it to some action.
if{$('#post_body_html').html()) { //line changed
alert('asdasda');
}
});