RIght Click Menu

HTML

<div class="editor-text" contenteditable="true">
    <img src="http://lorempixel.com/100/100/abstract">
    <br><b>^ Right click this</b>

    <br>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum scelerisque laoreet iaculis. Quisque dignissim placerat massa, feugiat sodales lorem vulputate eget. Sed et rutrum mi, et tincidunt lectus. Cras posuere nunc sed tortor facilisis ultricies. Phasellus adipiscing mattis porta. Sed ac est in magna sagittis consequat non et sem. Cras congue varius egestas. Duis augue nisl, tincidunt vitae tellus et, dapibus lobortis felis. In hac habitasse platea dictumst. Mauris ipsum est, dignissim vel pellentesque quis, volutpat ac leo.
    <br>
    <img src="http://lorempixel.com/100/100/transport">
    <div>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Explicabo quos adipisci corrupti nisi quidem dicta vero fugit nesciunt sed obcaecati quisquam officia consectetur eius culpa autem a eos! Repudiandae odio.</div>
    <div>Nobis aliquid pariatur voluptates ratione itaque nesciunt odit corporis at accusantium amet deleniti deserunt voluptatibus iure quibusdam eaque quidem ad vero commodi. Vero suscipit iste aliquam laboriosam non eaque excepturi!</div>
    <div>Quam aperiam eveniet voluptatem soluta recusandae commodi in fugiat est dolorum saepe ratione nulla iusto ex debitis repellat voluptates labore animi fuga esse dicta aliquam distinctio sunt voluptatum quos deleniti.</div>
    <div>Hic sequi consequuntur ipsam vitae pariatur rem provident porro et molestiae dolorem voluptatem delectus illo reprehenderit nisi dolorum nesciunt labore sapiente. Eius debitis labore ratione nihil dolorem. Similique accusantium quos?</div>
    <div>Aut aliquam maxime harum fugit amet ut eligendi dolorum reprehenderit eos ipsa earum dicta pariatur iure id aliquid ipsum minus expedita esse nulla veniam eum non voluptas praesentium enim minima.</div>
</div>

CSS

body {
    font-family:sans-serif;
    font-size:12px;
    background:#222;
}
.custom-menu {
    z-index:1000;
    position: absolute;
    background-color:#fff;
    border: 1px solid #ccc;
    padding: 2px;
}
.custom-menu a:link, .custom-menu a:visited {
    display:block;
    color:#222;
    text-decoration:none;
    font-size:14px;
    padding:5px 10px;
}
.custom-menu a:hover {
    background:#ccc;
}
.editor-text {
    background:#fafafa;
    padding:15px;
}
.editor-text:after {
    content:'';
    display:block;
    clear:both;
}
.float-right {
    float:right;
    margin:0 0 10px 10px;
}
.float-left {
    float:left;
    margin:0 10px 10px 0;
}

JavaScript

// Set temporary ID on selected element
$(function () {
    $('img').on('contextmenu', function (e) {
        $(this).attr('id', 'selectedImg');
         event.preventDefault();
    });
});
// Make the menu
$('.editor-text img').bind('contextmenu', function (event) {
    event.preventDefault();
    $('div.custom-menu').hide();
    $('<div class="custom-menu"><a href="#" class="fr">Float Right</a><a href="#" class="fl">Float Left</a><a href="#" class="fn">Normal</a></div>')
        .appendTo("body")
        .css({
        top: event.pageY + "px",
        left: event.pageX + "px"
    });
});

// Remove the menu
$(document).bind("click", function (event) {
    $("div.custom-menu").hide();
    event.preventDefault();
});

// Apply option to image you right-clicked on
$(document.body).on("click", ".fr", function (event) {
    // this won't work, but is what I want to happen.
    $('#selectedImg').removeClass().addClass('float-right').removeAttr('id');
    event.preventDefault();
});

// Apply option to image you right-clicked on
$(document.body).on("click", ".fl", function (event) {
    // this won't work, but is what I want to happen.
    $('#selectedImg').removeClass().addClass('float-left').removeAttr('id');
    event.preventDefault();
});

// Apply option to image you right-clicked on
$(document.body).on("click", ".fn", function (event) {
    // this won't work, but is what I want to happen.
    $('#selectedImg').removeClass().addClass('float-normal').removeAttr('id');
    event.preventDefault();
});

document.body.setAttribute('spellcheck', false);